|
Learn the basics of creating and editing content for your site. |
In this section, you learn how to: |
Add content to your site
On the right, select the page that you want to add content to and choose an option:
Double-click the page where you want to add content. | |
Or, click Insert and choose the content you want to add. |
Add titles and text. | |
Add content directly from the web, such as music and videos. | |
Add photos, designs, and other images. | |
Embed any file (From Drive) or the contents of a folder stored in Drive. If you make changes to your files in Drive, the same changes automatically show in Sites. | |
Add a table of contents. | |
Create and insert image carousels. | |
Add buttons which link to other content within your site, or to an external URL. | |
Add a (horizontal) divider line to your page. | |
Add YouTube videos (such as product trailers or company ads). | |
Add calendars (such as team or event calendars). | |
Add maps (such as office locations, event directions, or custom maps). | |
Add anything from Docs, Slides, Sheets, Forms, or charts from Sheets to your site. Any content you change in the source file automatically updates on your site. |
Edit text
To edit text or page titles, just click the box and enter new text. Or, from the toolbar above the text box, select another option.
Editing options:
Titles and headings | |
---|---|
Title |
Select a preset heading. Select Normal text for additional formatting options. |
Change the text alignment. | |
Insert a link for selected text. | |
Delete a title or text box. | |
Normal text | |
Select text and add bold or italics. | |
Add numbered or bulleted lists. | |
Go to more options. | |
Use the Code text style. | |
Select text and strikethrough it. | |
Select text and remove all formatting. |
Edit sections
Point to a section to change it.
- Change the background for each section—Click Style
and select a style. You can also select Image
to add a background image.
- Move a section—When you insert new content, it’s added to a new or existing section. To move that section up or down, click Move section
and drag the section where you want it.
- Duplicate a section—Click Duplicate section
. You can also copy and paste a section onto another page in your site.
- Add a footer—Scroll to the bottom of the page and click Add Footer
. The footer appears on all of the pages in your site. Point to the footer and click Edit footer
to edit it. To hide the footer on a page, point to it and click Hide footer on this page
.
Edit images
Resize an image:
Select the image and then drag the sides or corners of the image. Hold the Shift key while dragging to keep the image ratio.
Move an image:
Drag the image to a different part of the section or to a new section. You can place the image wherever you see a highlighted area.
Note: Currently, you can’t place an image in a text box.
Crop an image:
- Select the image and then select Crop
.
- Slide the dot to zoom in or out.
- Drag the image to change the visible portion.
- Click Done
.
- (Optional) To uncrop an image, select the image and click Uncrop
.
Replace an image:
- Select the image.
- Click More
Replace image
Upload or Select image and choose a new image file.
Add alt text to an image:
- Alt text appears when someone points over an image on your site.
- Select the image and click More
Add alt text.
- Enter a description and click Apply.
Add a banner
- In the top right corner, click Settings
.
- Click Announcement banner.
- (Optional) To customize the color of the banner, click Banner color and select a color. If Show banner isn't already toggled on, turn it on.
- In the Announcement section, in the text box, enter your banner message.
- (Optional) To create a button with a link on your banner, enter text in the Button label section and enter a URL in the Link section. If you want the link to open in a new tab on your browser, check the Open in new tab box.
- To choose how you'd like to display the banner on your site, in the Visibility section, select Home page only or All pages.
- At the top right, near your profile image, click Publish.
Add a logo
Logos appear in the top navigation bar, next to the site name.
Note: Logo files can be in .jpg, .png, or .gif format. For best results, the logo height should be at least 112 px.
- Point to the top of the page header and click Add logo
.
- Click Upload or Select.
- Select the logo and click Open or Select.
- (Optional) To change the color of the page header, under Background, click the Down arrow
and select a color.
- (Optional) To select a theme color based on your logo, in the Edit logo window, select a theme color.
Add content from another website
You can embed:
- Websites
- Web apps using Google Apps Script or App Maker
- Looker Studio reports
Depending on what website you add, you might be able to customize how the site appears on your site. Some allow a preview option or an option to see dynamically updated content. After you add content, you might need to sign in again to see the update.
Add content from another website:
- Open your site and on the right, click Insert
Embed.
- Choose an option:
- By URL—Paste the URL (link) you want to embed. Select Whole page or Preview and click Insert.
- Embed code—Paste or enter the site HTML code you want to embed and click Next
Insert.
Note: If you can't add or preview content, contact the website's owner.
2.8 Move and resize content
Anything you insert is added as a content “tile” on the canvas grid. Tiles snap to the grid so it’s easy to move, align, and edit them.
Move site content:
- Point to the content you want to move until you see Move
.
- Drag the content to a highlighted area.
Resize site content:
- Select the content you want to resize.
- Drag the blue circles to resize.
Group objects:
You can connect text boxes and images together in a vertical group.
- Add a photo and a text box to your site page.
- Drag the text box to the top or bottom half of the object until a blue line appears.
- To change the order of grouped objects, click the group you want to change.
- Click the object you want to rearrange and on your keyboard, tap the Up or Down key.
Ungroup objects:
- To ungroup text boxes and images, click the group you want to separate.
- Click the object you want to remove from the group, and drag the object away from the group