O'Reilly logo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Building Business Websites with Squarespace 7

Book Description

Master the tools and techniques of using Squarespace to create professional websites

In Detail

This practical guide walks you through the various steps involved in building a website for your business with Squarespace. You will learn how to use all of the tools provided by Squarespace to control the layout, appearance, structure, and functions of your website, starting from the inception stage, all the way to monitoring your site after it has been launched.

This is much more than just a how-to book for the Squarespace system: it's filled with helpful advice that will help you improve your website's visibility in search engines and tailor your site for your customers. Moreover, it provides dozens of other business-oriented tips to help your website stand out from the crowd. If you have used Squarespace 5 or other website builders/CMSes, this book will help you understand the key differences and teach you how to do things based on the new features of Squarespace 7.

What You Will Learn

  • Create your website framework, fill it with content, and arrange your pages using Squarespace's drag and drop layout tools
  • Customize your site's look and feel to match your brand, and create stunning visual impact, even on mobile and tablet devices
  • Configure the core functions your business needs such as sharing to social media, showcasing your work, or selling goods and services online
  • Discover time-saving tricks and how to avoid common pitfalls from an experienced professional with years of Squarespace experience
  • Gain valuable insights about search engine optimization and other e-marketing advice beyond just how to build a website
  • Understand how to monitor, measure, and manage your website post-launch
  • Develop an essential Website Toolkit that will act as reference material for your entire project, ensuring you stay on target to meet your objectives

Table of Contents

  1. Building Business Websites with Squarespace 7
    1. Table of Contents
    2. Building Business Websites with Squarespace 7
    3. Credits
    4. About the Author
    5. Acknowledgments
    6. About the Reviewers
    7. www.PacktPub.com
      1. Support files, eBooks, discount offers, and more
        1. Why subscribe?
        2. Free access for Packt account holders
    8. Preface
      1. Why choose Squarespace
      2. About this book
      3. What this book covers
      4. Who this book is for
      5. Conventions
      6. Reader feedback
      7. Customer support
        1. Downloading the support files
        2. Downloading the color images of this book
        3. Errata
        4. Piracy
        5. Questions
    9. 1. Setting Up for Success – Your Website Toolkit
      1. Understanding the process of making a website
      2. Understanding website concepts
        1. Structure
        2. Functions
        3. Content
        4. Aesthetics
      3. Writing a website plan
        1. About your business
          1. Business overview (the "elevator pitch")
          2. Slogan (a.k.a. tagline or strapline)
          3. Brand image
        2. About your audience
          1. Your customers (the site's target audience)
          2. Primary purpose
        3. About your website
          1. Goals
          2. Functions
          3. Content
          4. Integration
          5. Site management
        4. About this project
          1. Project team
          2. Project timelines
          3. Project budget
      4. Gathering materials, ideas, and inspiration
        1. Creating idea boards
          1. Website inspiration
          2. Other resources for inspiration
      5. Creating a sitemap
        1. Don't make your customers work hard
        2. Break it down
        3. Keep it simple
        4. Consider action words
        5. Include notes or wireframes
      6. Gathering raw materials
        1. Branding
          1. Logo
          2. Colors
          3. Fonts
        2. Text content
        3. Photos
        5. Videos or audio streams
      7. Summary
    10. 2. Getting Started with Squarespace
      1. Signing up for a Squarespace account
      2. Finding your way around Squarespace
        1. Understanding the Site Manager interface
          1. Understanding Annotations
          2. Using the Home Menu
        2. Using the Pages area
        3. Using the Design area
        4. Using the Commerce area
          1. Using the Metrics area
        6. Settings
      3. Logging in and out of Squarespace
        1. Logging in
          1. Logging in by pressing Esc
          2. Accessing your site's login page
          3. Logging in via the Squarespace site
      4. Adjusting basic site settings
        1. Adding Basic Information
        2. Setting your site's language and region
          1. Setting up the SEO options
        3. Keeping your site private until its launch
        4. Setting up your subscription plan and billing
          1. Choosing the right subscription plan
            1. The Personal plan
            2. The Professional plan
            3. The Business plan
          2. Setting up your billing information
      5. Summary
    11. 3. Working with Squarespace Templates
      1. Understanding Squarespace templates
        1. Characteristics of a Squarespace template
          1. Page structure
            1. Canvas
            2. Header
            3. Body
            4. Footer
            5. Sidebar(s)
          2. Visual style
          3. Special features
            1. Different homepage
            2. Secondary navigation area
            3. Index page
            4. Variable header images
            5. Promoted Blocks in blog posts
            6. Fixed navigation
      2. Choosing the right Squarespace template for your site
        1. Selecting the best template for your needs
          1. Step 1: Consider the site's primary purpose and important functions
          2. Step 2: List the special features that you want
          3. Step 3: Identify the page structure you like best
          4. Step 4: Refer back to your brand and content
        2. An overview of the different Squarespace templates
        3. Browsing templates
          1. Important points to remember when browsing templates
          2. Using the template's Read Me page
        4. Trying out a new template for your site
          1. Installing and previewing a new template
        5. Choosing your final template
          1. Fullscreen preview
          2. The Style Editor
          3. The Pages panel
        6. Applying your chosen template to your site
          1. Making a template live
      3. Summary
    12. 4. Creating Your Site Framework: Pages, Items, Collections, and Navigation
      1. Understanding Squarespace pages
        1. Standard page
        2. Collection Pages
        3. Cover Page
        4. Page cluster
        5. Special properties of Collection and Index Pages
      2. Adding pages to your site
        1. Using the Pages panel
        2. Understanding your template's unique way of displaying page elements
        3. Using demo pages to create new pages
        4. Standard page settings
          1. Navigation Title
          2. Page Title
          3. The Enabled checkbox
          4. Page Layout
          5. Page Description
          6. URL Slug
          7. Password
          8. The Thumbnail Image
          9. Page Controls
          10. Page Settings action buttons
        5. Creating new pages
        6. Collection Page settings
          1. Blog Page Settings
          2. Gallery Page Settings
          3. Events Page Settings
          4. Index Page Settings
          5. Products Page Settings
          6. Album Page Settings
        7. Adding items to Collection Pages
          1. Configuring the item settings
            1. Blog post settings
            2. Event settings
            3. Gallery image settings
            4. Gallery video settings
            5. Product settings
            6. Album track settings
          2. Organizing items in Gallery, Products, or Album Pages
          3. Moving Blog posts
          4. Deleting items
        8. Creating a Cover Page
          1. Setting up your Cover Page
      3. Organizing your site's navigation
        1. Folder Settings
        2. Creating an Index
          1. Index Settings
        3. Rearranging pages
          1. Adding pages to a Folder or Index
          2. Opening and closing Folders or Indexes
          3. Adding pages to a secondary navigation area
        4. Removing pages from your site
          1. Disabling pages
          2. Storing pages for later
          3. Deleting pages
            1. Moving pages to the Recycle Bin
            2. Restoring a page from the Recycle Bin
        5. Adding external site links to your site navigation
          1. Adding social media profile links
          2. Adding links to third-party sites
      4. Summary
    13. 5. Adding, Editing, and Arranging Content in Your Web Pages
      1. Understanding Blocks
      2. Adding and removing blocks
        1. Adding a block
        2. Removing blocks
      3. Adding basic content to your pages
        1. Adding and formatting text using Text Blocks
        2. Adding images using Image Blocks
          1. Using stock images from Getty Images
      4. Arranging blocks on the page
        1. Moving a block to another position on the page
        2. Canceling a move or other adjustment
        3. Understanding fluid layouts and responsive design
          1. Responsive design, image sizes, and screen resolutions
        4. Adjusting the size of blocks and columns
          1. Adjusting the width of columns, adjacent blocks, or wrapping blocks
          2. Using Spacer and Line Blocks to fine-tune layouts
            1. Adjusting the height of a Spacer Block
      5. Adjusting images in Squarespace
        1. Cropping and zooming images with LayoutEngine
        2. Adjusting the Focal Point of images
        3. Using the Aviary Image Editor
      6. Adding content to sidebars or footers
        1. Adding or editing content in a footer
        2. Adding or editing content in a sidebar
          1. Enabling a sidebar
      7. Adding links that point to web pages or files
        1. Assigning a link to word(s) in a Text Block
        2. Assigning a link to an image
        3. Creating a Button on your page
      8. Summary
    14. 6. Using Blocks to Add Functionality, Rich Media, and Special Features
      1. Adding images – beyond the standard Image Block
        1. Gallery Blocks
          1. Adding a Gallery Block
        2. Adding galleries from external photo-sharing websites
          1. Adding a gallery from Flickr, Instagram, or 500px
      2. Embedding video into your pages
      3. Adding a Google Map to your site
      4. Capturing data and handling enquiries on your website
        1. Using forms
          1. Adding a form to your page
            1. Using the Build section in the Form Editor
            2. Setting the Storage preferences in the Form Editor
            3. Customizing the Advanced settings in the Form Editor
        2. Using Newsletter Blocks
      5. Using content blocks to improve internal navigation and highlight content
        1. Adding a search box
        2. Displaying lists of tags, categories, authors, or dates
          1. Displaying a list of tags or categories as a cloud
          2. Displaying date-based lists in a calendar format
        3. Using Content Link Blocks
        4. Using Summary Blocks – the most powerful of blocks
          1. Creative ways to use Summary Blocks
            1. Featuring and filtering content
            2. Bypassing template design restrictions
          2. Summary Block design options
            1. Grid
            2. List
            3. Carousel
            4. Wall
          3. Summary Block filtering and display options
      6. Inserting sales or donation blocks to make transactions fast and easy
        1. Using Amazon Blocks
      7. Displaying a price list
        1. Using Menu Blocks
      8. Adding audio to your website
        1. Using the Audio Block
          1. Additional settings for podcasting
        2. Using the Soundcloud Block
      9. Adding a Twitter feed
      10. Other types of blocks
      11. Summary
    15. 7. Selling Online or Taking Donations with Squarespace Commerce
      1. Setting up your Squarespace Commerce store
        1. Prerequisites for Squarespace Commerce
          1. The physical location of your business
          2. The right Squarespace subscription plan
        2. Gathering your store content
        3. Configuring your store
          1. Store Settings
          2. Connecting to Stripe
          3. Other Store Settings
          4. Taxes
            1. Setting up a new country tax rule
            2. Setting up a new state/province tax rule
            3. Setting up a local area tax based on postal/zip codes
          5. Email Settings
          6. Shipping
      2. Creating and managing products
        1. Product types
        2. Adding product items
        3. Removing or rearranging products
        4. Importing products from Big Cartel, Etsy, or Shopify
        5. Managing products using Inventory
      3. Testing your store
      4. Handling orders
        1. Processing orders quickly or in bulk
        2. Using Order Summary
      5. Promoting products and offering discounts
        1. Using Product Blocks to enable quick purchases from anywhere on your site
        2. Using Summary Blocks to showcase featured products
        3. Offering and promoting discounts
          1. Coupons
          2. Using the Announcement Bar to highlight discount codes
      6. Setting up and managing donations
        1. Adding a Donation Block
        2. Testing donations
        3. Viewing and exporting donations received
      7. Handling transactions without Squarespace Commerce
      8. Summary
    16. 8. Tailoring Your Site's Look and Feel
      1. Understanding Squarespace template customization
        1. Finding your way around the Style Editor
          1. Selecting an element for adjustment
          2. Saving changes in the Style Editor
          3. Testing your template customizations
          4. Resetting the template
          5. Switching templates with customizations applied
      2. Working with fonts and typography
        1. Choosing fonts
        2. Using fonts on your website
        3. Other typography settings
        4. Applying typography changes to your template
        5. Easier ways to find, compare, or match fonts
          1. Using Google or Adobe Typekit font-finders
            1. Google Fonts
            2. Adobe Typekit
          2. Finding fonts that are similar to other fonts
      3. Adding or creating a logo in Squarespace
        1. Creating a text-based logo in Squarespace
        2. Designing your own logo using Squarespace Logo
        3. Adding an image-based logo to your site
          1. Adjusting logo size and positioning
      4. Adjusting your website's color scheme
        1. Tools and resources for choosing colors
          1. Color picker tools
          2. Resources for color schemes and color inspiration
        2. Controlling the color and opacity of page elements
      5. Using background or header images
        1. Other ways to adjust header or banner images
      6. Adjusting an element's size, position, visibility, or other options
        1. Controlling element visibility and other options
      7. Adjusting Cover Page styles
      8. Summary
    17. 9. Going Live with Your Website and Driving Traffic to It
      1. Connecting to social media accounts
        1. Setting up Connected Accounts
        2. Displaying social icons
          1. Using a Social Links block
          2. Showing or hiding individual social icons
      2. Enabling social sharing on your website
      3. Adjusting the final details in your site settings
        1. Adding a Browser Icon (Favicon)
        2. Using Google Analytics with your Squarespace site
        3. Adjusting SEO settings: description, title, and URL formats
          1. Configuring blog settings
      4. Testing your site before launch
        1. Verify that your site works at all sizes
        2. Fine-tune your site and page elements with SEO in mind
        3. Thoroughly test all of your site functions
        4. Ensure your media files look the way they should
        5. Look out for broken links
        6. Double-check your tags and categories
          1. Verify that your social blocks are automatically pulling in fresh content
      5. Making your website live to the public
        1. Removing the site-wide password protection
        2. Setting up a custom domain
          1. Registering a new domain through Squarespace
          2. Using an existing domain name
            1. Moving from an existing website to Squarespace
          3. Transferring a Squarespace 5 domain
          4. Using custom email addresses with your custom domain
          5. Managing your domain and URLs
      6. Driving traffic to your website
        1. Making your website visible to Google and other search engines
        2. Using social media to drive traffic to your site
          1. Automatically promoting news or blog posts
            1. Enabling the push option
            2. Pushing a blog post to a social site
          2. Displaying a Squarespace page or Gallery in your Facebook page
      7. Summary
    18. 10. Managing Your Squarespace Website
      1. Monitoring visitors and activity on your website
        1. Understanding your website traffic
        2. Finding out where your visitors came from
        3. Learning how visitors search for you
        4. Finding out what's popular on your website
        5. Other metrics reports
      2. Managing comments on your blog
        1. Approving comments
        2. Replying to comments
        3. Deleting comments
          1. Handling flagged comments
      3. Giving other people access to edit, monitor, or administer your website
        1. Adding a Contributor
          1. Modifying, canceling, or resending a contributor's invitation
        2. Modifying or removing a contributor's permissions
        3. Recommendations for all content editors
        4. Adding a Basic Author
      4. Using floating bars on your website
        1. Using an Announcement Bar to highlight important information
        2. Making it easier for mobile site visitors to reach you
      5. Using Squarespace mobile apps
        1. Blog
        2. Metrics
        3. Portfolio
        4. Note
      6. Summary
    19. 11. Moving beyond Standard Squarespace Tools
      1. Understanding advanced customization options
        1. Using the Squarespace Help Center for customization
        2. Types of code customization
          1. Code Block
          2. CSS Editor
        3. Sitewide code injection
          1. Per-page code injection
      2. Finding Squarespace designers and developers
      3. Summary
    20. A. Getting Help with Squarespace
      1. Knowledge Base
      2. Community Answers
      3. Open a support ticket for 24/7 e-mail support
      4. Live Chat
    21. B. Squarespace Templates in a Nutshell
    22. C. List of Online Resources Used in This Book
    23. Index