Search

Public/Promotional Webpage Design - Editing Notes

Webpage Editing Notes

 Important Editing Notes Using Existing Templates

Pasting Text

Changing Images

Using Buttons

Adding an Anchor

Shortcuts

Pasting Text

It’s tempting to copy & paste text into the boxes themselves – but this messes up the formatting a lot of the time. i.e.

ALWAYS paste into the content area in the “Edit Text Editor” on the Left-hand side. I.e.

Changing Images

There are two types of Image types that appear in these templates. 

The below image is a singular image. You can edit it directly by selecting the blue pencil in the top right-hand corner of it.

You can click on the image in left-hand menu to change:

Choose a photo from the media library, or upload a new photo by draging the file into the area.

or

** Note that when adding a new photo, we need to make sure that the file isn’t too large because this affects the load time for the page. So we have to shrink the image. To Shrink the image we go to a website called TinyPNG. This website allows us to drag the images into the boxed area and download a smaller file size. Then we can add it to the media section of our site. 

 

This type of image is the background of the section and to replace it, you have to click on the 6 dots that allowyou to contol the section:

Use the “style” area on the left-hand menu to edit this image.   


** Note that the position allows you to select the area of the photo that appears. 

 

 

Buttons

You can move the item around by clicking and dragging the blue pencil

Right click on the pencil and various options will appear.


Duplicate is great because you don’t have to recreate a new button!

Adding a link to a button:


Adding an Anchor

Anchors connect two sections together. You know when you click a button or a text and it takes you somewhere lower down on the page? That’s what an anchor does.

In this example, I am going to anchor the “Get a Quote” to a form that’s lower down on the page.

Select the down pointing arrow icon:

Under the content menu, use a word with the pound symbol in front of it:

Scroll down to the thing that you want the person to go to when they click on the down pointing arrow (in this case it’s a form I’d like them to fill out. Click on the dots to choose what you’re editing:

Under the advance tab for the section write the above word, without the # symbol:

Shortcuts

Copy & Pasting betweeen Pages:

You can copy & paste between pages within a website. This is perfect for when you already have a page created with a certain style for a section that you want to use on the new page you’re creating. 

Example Below:

 I want to use this entire section’s style on a new page. Right click on the white dots and select “copy” 

Paste it into the boxed section at the bottom of the page

Notes: 

  • Always make sure to change the links
Scroll to Top