WEBSITE MAINTENANCE

Guidance for Content Edits and Additions

GENERAL NOTES

• Color code for green: #82a868 
• "Undo" features like CTRL+Z are only possible when typing in an individual text box (e.g., you have not clicked away). Otherwise, it is difficult to impossible to recover deleted info. Be cautious when deleting content. This applies to entire websites on the main Weebly menu and, inside the editor for an individual site, all pages, sections, color blocks, titles, text, and photos.
• Grammar/Consistent Language:
  • PA TIC (with a space) used sitewide for consistence, not PATIC (no space).
  • ​Provide full name for organizations on first mention on each new webpage, followed by parenthetical abbreviation, such as "Pennsylvania Fish and Boat Commission (PFBC)." Abbreviations can be used in place of name thereafter.
  • Common names are capitalized site wide (e.g., Brook Trout rather than brook trout), consistent with PFBC language. Non-specific names (e.g., trout) are NOT capitalized unless appearing as proper nouns in a page title (e.g., All About Trout) or at the beginning of a sentence..
• Text Font, Size, Color: Most text font, size, and color codes are defaulted according to the Theme and to some modifications to those Theme settings during the website's initial build.
  • When adding a Title or Text via the "Build" menu, the default fontface/size/color of the text that appears can be changed under the "Theme" tab > "Change Theme." Adjustments to Theme settings will create sweeping changes sitewide, not just on individual pages. 
  • Titles and Text have limited customization; on the text edit menu, you can change the color to a specific html color code (or select a color visually), and you can toggle between + or - on the text's edit menu to increase or decrease text size by automated leaps in sizing. You can also bold/italicize/underline text and, by clicking the chain on the edit menu, embed links to files/websites/Site Pages. You can add bullets/numbers (black ONLY!!! this cannot be changed except in sitewide changes to all bullets in Theme settings). You CANNOT manually change the fontface or the size number (e.g., size 14) for individual words, text boxes, or pages.
• Testing Contact Forms: All Contact Forms (can add on "Build" editor) should be tested immediately after publication. Under "Form Options," add preferred email under first editable box (may be automatically set to c-rkester@pa.gov). Message confirmation can also be customized here. Click "Save" and publish the site. As a viewer of the published site, send a test email. If email is not received within 10 minutes, contact Weebly Pro support OR delete the Contact Form if you feel the listed email/phone/contact would suffice.
• Backing Up Site Content: Each time the site is updated and republished, remember to do the following:
  • Update the "PA TIC Website_Text Content" Word document to reflect all changes to primary changes to text and captions. No need to worry about hyperlinks to files or webpages, only to websites (if applicable).
  • Old copies of the site should be deleted from the Weebly home page, and a new copy should be made for security purposes. 
  • Save newest versions of files or photos in a folder maintained by PATU. Ask the PATU Program Director for info on this.
• Pro Upgrade Features: Without Pro status, the following features may be lost: Search Box, Customized Footer, PayPal.
• Moving Sections: Sections (added from the "Build" page) can be moved ONLY up or down one section at a time on the same page. Sections can be moved OR copied to either the same page or to a different page. When moved/copied to a different page, Sections typically appear at the TOP of the page. Headers CANNOT be movied or copied easily.
  • If moving/copying multiple (1+) sections to a new page (e.g., you'd like to make many of the Sections on the DIVE INTO TIC page move to a new subpage titled "Program Overview" in order to retain the header formatting for the subpage): Assuming you'd like these sections to appear in the same order: Work in reverse chronological order, moving/copying sections from the BOTTOM of the old page up. This helps ensure that as sections are moved/copied to the new page, they stack on top of on another in the order you prefer. 
• Headers: These were manually created to reflect 3 categories: HOME page header (turquoise/yellow/green brook trout fry as main photo) - larger footer than rest with subtext, 2) primary page header (turquoise/yellow/green brook trout fry as main photo; page title in white all caps, such as DIVE INTO TIC), and 3) subpage header (yellow egg photo; page title in white title case, such as Program Timeline). The ALL ABOUT TROUT primary page features a different header (brook trout skin) and page breaks (salmonid illustrations) than all other pages.
  • Creating New Pages with Matching Header: Headers CANNOT be moved or copied in the same capacity as Sections. However, all new pages should reflect the formatting established for categories 2 (primary pages) and 3 (subpages). This is most easily done by copying a page in the same 2 or 3 category as your desired new page and modifying the copy:  
    1. Visit the "Pages" tab and click a page at the appropriate level. Click "Copy" at the bottom of the gray sidebar menu. The copy will appear with the exact same title at the bottom of your list of Pages!
    2. Select your copy from the Pages menu and change the name before you do anything else. This helps you keep track to avoid deleting important information!
    3. On the Pages menu, move your new page in the order you'd like it to appear. Now, visit the page to delete all sections, titles, and text, EXCEPT the header to begin with a blank canvas. Update the title following the capitalization rules for headers: all caps for primary pages (DIVE INTO TIC), title case for subpages of all levels (Program Timeline); do not change font color or +/- size on the text edit menu.
• Spacing: Remember that you can adjust spacing (margins at top, botom, left, right) and most dividers, spacers, photos, and color boxes. This is helpful to ensure that photos line up as you intend them to, as seen in the three rows of porthole staff images under CONTACT, "Meet the Team." Each photo has the same spacing margins, and these can be reduced/increased at the top or bottom to provide less/more text between the images and the text. Spacing can be adjusted by clicking an image (or comparable item) and clicking "Spacing" from the menu.
  • You may also drag/drop a "spacer," an essentially blank/clear box of space, from "Structure" on the Build menu; spacers can be adjusted by clicking the spacer and dragging the blue margin until the spacer is the intended size.
• ​Installed Apps: Under "Installed Apps" on the Build menu, the following apps have been added to the PA TIC site at the FREE rate (some apps may have upgrades available for $):
  • Color Block - As seen in colored boxes under Contact Us
  • Events Calendar - As seen on Workshops
  • Porthole - As seen in circular photos throughout site. Drag/drop Porthole FIRST to a page. Then, click the porthole to upload a photo. Photos should be cropped to squares ("eye-ball" this a few tries) under "Edit Image" to appear as perfect circles. The site's current formatting is a blend of circular portholes and photos with original rectangular dimensions; oval portholes NOT recommended due to poor visibility.
  • POWr Form Builder - as seen on the Pa TIC Website Feedback Form that appears as a survey at bottom of Home page and a floating tab on every other page 
    • These are technically 2 different forms: 1 with the floating tab added to all pages but HOME, and 1 with the full survey visible on HOME page
    • If making edits to form questions, changes need to occur on BOTH forms' settings
    • Only 6 questions can be added in free version of app. Current questions closely mirror language used in survey distributed in Jan 2019 on old PA TIC site.
    • Form responses emailed to Rachel Kester, PATU Program Director. Rachel will forward replies to Cody. Multiple emails could be added is separated by a comma and space (not a semicolon).
  • Simple Table - as seen on Program Timeline

LINKS: Adding Pages, Files, and Websites

• Hyperlinks appear orange sitewide, according to Theme settings.
• Adding Hyperlinks: In any text or title box, highlight the individual word(s) or phrase(s) you want hyperlinked. Click the white chain on the small black text edit menu. A Link box will appear that allows you to choose what you'd like to link the viewer to, with common options including Standard Page (e.g., an existing page on the PA TIC Website, such as CONTACT), a website url, an email address, or a file (PDF, .jpg, .png, Word, etc.)  
  • Once you select what destination your link will have, always check "Open in new window." To double-check link will open in new window, hover over your hyperlink and click "Chnange." You can now visit the link and see if the box is ticked.
• Adding Buttons: Buttons are valuable features to draw special attention to important hyperlinks, as seen in the footer. To add a button, drag and drop button from "Basic" under the Build menu. Click the button to change the text and add a link in the same way you add a hyperlink. You can even choose 1 of 4 styles for your button: 

PHOTOS

• Lightbox - If applicable, images should always have the "Lightbox" feature toggled ON, meaning that viewers can click a photo to enlarge it for their own printing/copying educational purposes!
  • Lightbox is NOT possible for Slideshow. It is possible for Porthole, Gallery, and regular Images.
  • For applicable images, click the image and toggle the Lightbox to blue in the pop-up menu.
• Porthole - As seen in circular photos throughout site. Drag/drop Porthole FIRST to a page. Then, click the porthole to upload a photo. Photos should be cropped to squares ("eye-ball" this a few tries) under "Edit Image" to appear as perfect circles. The site's current formatting is a blend of circular portholes and photos with original rectangular dimensions; oval portholes NOT recommended due to poor visibility.
• Captions - Captions can add valuable context to a photo for educational purposes, and they can also support a photo courtesy requested by an external party. However, too many captions or too-long captions can distract the viewer. Captions should be added only when they enrich the photo. For photos that can have captions (e.g., not always a Gallery photo or background photo option), simply click the photo and scroll down to Caption. ​

---