Website Design & Layout

Top
  • ProcessWire Made Easy: HollyWorks Help Site logo

    • Website Design & Layout
      • Primary Navigation
      • Footers
      • Social Icons
      • Facebook Sharing Image
      • Button colors, shapes
      • Sidebar Additions
      • Logos
      • Menubar
      • Code (eg. Google Analytics)
      • Page Top Options: Slides, Video
    • How to...
      • Logging In and Out
      • The Document Tree
      • Create a Page
      • Choosing a Template
      • Basic Page Layout
      • Editing a Page
      • Adding Content: Text
      • Styling text: Blockquotes
      • Adding Content: Images
      • Cropping & Resizing Images
      • Adding Content: Links & PDFs
      • Adding Content: Video
      • Viewing a page
      • Page Commands: Move, Hide, Delete
      • Page Top Photos
      • Page Tops: Slides and Video
      • Feeds: Blog, Events, News, Logos
      • META Data
      • Add code to the template (Google Analytics, etc.)
      • Create Sitewide Navigation
    • Content Features
      • Blog
      • Blog Authors
      • Calendar
      • Media
      • News
      • Photo Galleries
      • Priorities
      • Publication Library
      • Legislative Tracker
      • People (Staff, Trustees, Board)
    • Landing Page Displays
      • Basic Landing Page Structure
      • Accordions
      • Big Hero
      • Call to Action
      • Centered Image with Caption
      • Code Block
      • Fat List
      • Mini Gallery
      • Multicolumn with Images
      • Nav Bar
      • Overlay Block
      • Panoramic Image
      • Photo and Copy
      • Quick Text
      • Sliders and Carousels
      • Spacer
      • Two Cards
      • Page Top Alerts
  • Contact
  • Website Design & Layout
    • Primary Navigation
    • Footers
    • Social Icons
    • Facebook Sharing Image
    • Button colors, shapes
    • Sidebar Additions
    • Logos
    • Menubar
    • Code (eg. Google Analytics)
    • Page Top Options: Slides, Video
  • How to...
    • Logging In and Out
    • The Document Tree
    • Create a Page
    • Choosing a Template
    • Basic Page Layout
    • Editing a Page
    • Adding Content: Text
    • Styling text: Blockquotes
    • Adding Content: Images
    • Cropping & Resizing Images
    • Adding Content: Links & PDFs
    • Adding Content: Video
    • Viewing a page
    • Page Commands: Move, Hide, Delete
    • Page Top Photos
    • Page Tops: Slides and Video
    • Feeds: Blog, Events, News, Logos
    • META Data
    • Add code to the template (Google Analytics, etc.)
    • Create Sitewide Navigation
  • Content Features
    • Blog
    • Blog Authors
    • Calendar
    • Media
    • News
    • Photo Galleries
    • Priorities
    • Publication Library
    • Legislative Tracker
    • People (Staff, Trustees, Board)
  • Landing Page Displays
    • Basic Landing Page Structure
    • Accordions
    • Big Hero
    • Call to Action
    • Centered Image with Caption
    • Code Block
    • Fat List
    • Mini Gallery
    • Multicolumn with Images
    • Nav Bar
    • Overlay Block
    • Panoramic Image
    • Photo and Copy
    • Quick Text
    • Sliders and Carousels
    • Spacer
    • Two Cards
    • Page Top Alerts
Contact
ProcessWire Made Easy: HollyWorks Help Site



Creative Consulting • Design for People • Smarter Programming • Global Publishing • Contact: Holly@HollyWorks.com

BoilerPlate Books, LLC |  Holly Valero  |  HollyWorks Web Design

Location: Document Tree > Sitewide Assets

Website design and layout is where you'll find all the controls that govern the colors, fonts, widths, layout and design of your website. Content blocks are all editable individually, but for the overall wrapper you'll find:

1. sitewide navigation - check the boxes for which to include:

2. Optional information strip along the very top with your email and social links

3. Chunky footer adds an editable text area. Choose your colors.

4. Overall website width; font pairings; title alignment; social sharing description and social media links. (drag these up and down to re-order them) For authors, bookstore links.

Width detail:

Fonts (for custom Google fonts, just ask)

Social media icons

Bookstores

5. Sidebar block for embeddable code (social feeds, mail list, etc.)

Sample placement of a BlueSky post:

6. Facebook sharing image - with instructions for refreshing this this Facebook tends to cache it.

7. Website button colors and shapes; logos for navigation and footer - with preferred sizing and placement

8. Sitewide menus: menu bars, dropdowns, text color, link colors, plus an accessibility boost checkbox to underline all links

9. Code blocks for Head, Body, and Footer - to accommodate any analytics or third party tools, and an upload area for images and documents.

  • Website Design & Layout
    • Primary Navigation
    • Footers
    • Social Icons
    • Facebook Sharing Image
    • Button colors, shapes
    • Sidebar Additions
    • Logos
    • Menubar
    • Code (eg. Google Analytics)
    • Page Top Options: Slides, Video
  • How to...
  • Content Features
  • Landing Page Displays
ProcessWire Made Easy: HollyWorks Help Site



Creative Consulting • Design for People • Smarter Programming • Global Publishing • Contact: Holly@HollyWorks.com

BoilerPlate Books, LLC |  Holly Valero  |  HollyWorks Web Design

linkedin-in