Glenbrook Website Editing Tips
Here you will find some useful tips to remember when editing your website!
Organize content into rows and columns
One of the best things about Squarespace it what they call their "Layout Engine". This is where you can drag and drop content blocks to position them on the page and create rows and columns of content. To use the Layout Engine:
- Add a block to your page by clicking on the + button near the area you want the content.
- Select the type of content block you want to add (this will most often be a text block, but can also commonly be image, gallery, video and map blocks). To add a block you can click on the type you want to add and it will automatically add the block as the next full width block on the page. Or, you can drag the block from the selection panel and drop it in the location you want it on the page.
- Once a block is on the page you can click and drag it to move it. When you are moving content blocks you should be able to see some guides showing if you are creating a new row or column, inserting it into an existing row or column, or "floating" it. When it is being "floated" it means that other content should wrap around it.
Here is a link to tutorials about using Squarespace content blocks. Keep in mind that your website is custom built and based on the development needed for your specific design, some blocks have not been styled, and some customizations may change the way things work natively -- but these tutorials should be helpful overall if you are wanting to learn more about working with Squarespace.
Working with Sections
This website is setup with a custom page type called 'Sections'. When you add a page to the site you can use the 'Section' page type to create a multi-page section.
A section contains:
- Section frontpage with top header area, titles and summaries of sub-pages, and a bottom footer area
- Individual full pages for each sub-page
Change the order of sub-pages
You can change the order of your pages in the backend by dragging and dropping them into the order you want.
In the backend, double click on a sub-page to edit it. The first panel in the editing box will be the main content for the sub-page and the smaller text area in the 'options' panel is where you can designate the content to be displayed on the section's frontpage - this is the summary/excerpt or short description of the sub-page. If you upload an image in the options panel it will be displayed along with the summary on the section's frontpage.
Add a new sub-page
Simply click the + Add button at the top right of the backend interface and fill in the content for your new sub-page. Don't forget to add the summary in the options panel. Once you have added and saved your new sub-page, it's a good idea to go back into it's editing box and double check the url created for the page in the options panel. Sometimes it is ideal to revise the url to be more user friendly (for example, if the url can be shortened or cleaned up to be easier to read or to type - especially for the more important pages).
Working with Events
The events section is similar to 'sections' - however events sections are setup slightly different.
ALL EVENTS: You currently have one main "Events" page (http://www.glenbrook.com/events) - where you input all your events.
COURSE SCHEDULE: There is also a 'Schedule & Fees' page which automatically loads in events from the Events section that have been tagged as Boot Camp or Workshops. Boot Camp and Workshop event data is also automatically listed in other areas of the site as well (i.e.: homepage, education, boot camp, workshops).
It is important to note:
- The Event boxes display the main content for the event post (the content entered into the main area of the event post's editing box).
- The summary content for an event (content that is specified in the options tab, in the 'excerpt' box) is displayed throughout the site where it lists upcoming event dates (i.e.: upcoming workshops).
- When editing or posting a new event make sure to follow a consistent format:
- put event title in the title field (ie: Payments Boot Camp -or- Innovation in Payments Workshop),
and then in the main content area put in the following order:
- event date (h3 style)
- workshop title (bold)
- event location
- link to course description page (ie: Payments Boot Camp page or Workshop page)
- event logistics | register link
(copy the format used for existing events)
- Set the date and the category:
- set the event date at the top under the title area, and in the publish date area at the bottom right
- set the category for the type of event at the bottom left (ie: Payments Boot Camp -or- Workshops)
- In the summary area of the options panel, enter in the following order:
- description and/or event logistics links (optional)
Working with Products
The products section is similar to 'sections' as well. Each product has it's image displayed on the products frontpage, each clicking to their own full detail page. In the backend, double-click on an existing product box to edit it or click the + button at the top right to add a new one. The editing box provides a place to input the title and some summary text (displayed in the top area of the product detail page), a price, full page content area, a product thumbnail and the file itself (for digital products). It is also good to check the url for the product page in the options area of the editing box.
Working with Downloads
To make a file accessible for download, type in some text (ie: the filename) and then make it a link, in the link settings upload the file you want to make accessible - or select a previously uploaded file.
If you want to collect user information before they can access the file, then instead of adding the link to the file, add a form block. add the form fields that you want the user to fill out. In the "Storage" tab enter in the email address you want the information sent to. In the "Advanced" tab, put the link to the file in the "Post-Submit Message" area, and use the settings to make the form open as a popup (enable "lightbox" mode). Also - see the ones i setup for you for reference to keep it consistent.
The page that has the file links for download can be a public page or you can password protect it in the "page settings" at the top right of the backend view for the page.
One important issue with your site will be the concept of "relative links". Your website is located at www.yoursite.squarespace.com - however, when it launches we will map your real domain / address so that can also be used to be directed to your website. Because of this, we want to make sure to use "relative" links so that the links dont break when the domain gets mapped at launch.
A direct link: www.yoursite.com/pagename
A relative link: /pagename
You can see that a direct link includes the domain part of the address, while the relative link only includes everything after the domain (after www.yoursite.com). When using relative links the correct domain will automatically get filled in so links dont need to be updated when you map the domain or if you change your domain. It is important to only use relative links.
Avoid unwanted paragraph spacing
Use the 'return' or 'enter' key on your keyboard to start a new paragraph (this will add a space after your last line of text and your next line of text) -- use 'shift + return' to start a new line without the space. This is an important tip to remember in order to keep your text nicely organized. Also beware of extra spacing that often accidentally gets added to the end of text blocks. I often double check text blocks to see if there is an extra return at the end.
Beware of pasting in content from Microsoft Word
When text is pasted in from Microsoft Word or other sources, unfortunately, the formatting applied in the document comes along with it and overrides the styles built into your website. In worst-case scenarios this hitch-hiking code can cause bigger problems. If you need to paste text in from another source, it is important to first strip out the formatting and other background coding.
IMPORTANT!!! PASTE AS PLAIN TEXT: When editing the text in a text block, click the 'little t in a box' icon towards the right end of the text formatting toolbar. That will open up a box where you can paste in text from another source (i.e.: a Word document), and the unwanted formatting will be stripped out for you.
Use this every time you paste in content.
Some areas of this website allow you to work on pages in draft mode before publishing them. These are all your "section" areas (such as Team, Workshops, Clients, Knowledge), and "events" areas (your Course Schedule).