Avenue CSS ID List

Some CSS ID/Class in Avenue template Squarespace.

The code is checked on Avenue demo template at Squarespace.com/templates

Header

  • site title: .site-title .logo a
  • tagline: .logo-subtitle
  • logo: .logo-image .logo img
  • navigation: #topNav nav
  • navigation items: #topNav nav li a
  • mobile menu text: #mobileMenuLink a
  • mobile navigation: #mobileNav
  • mobile navigation items: #mobileNav nav ul li a
  • header: header#header

Footer

  • footer: footer#footer
  • footer links: footer#footer a

Blog List

  • blog list page: .collection-type-blog.view-list
  • blog title: h1.entry-title a
  • blog date: time.published
  • share text: .ss-social-button
  • like count: span.like-count
  • like icon: .sqs-simple-like .like-icon
  • blog post item: .collection-type-blog.view-list article
  • sidebar: aside#sidebar
  • sidebar blog title: aside#sidebar .summary-title-link
  • sidebar blog date: aside#sidebar time.summary-metadata-item.summary-metadata-item–date

Blog Detail

  • blog detail page: .collection-type-blog.view-item
  • blog title: h1.entry-title a
  • blog date: time.published
  • share text: .ss-social-button
  • like count: span.like-count
  • like icon: .sqs-simple-like .like-icon
  • pagination: .collection-type-blog .pagination
  • pagination text: .collection-type-blog .pagination a
  • pagination next: .next-item
  • pagination pre: .prev-item
  • sidebar: aside#sidebar
  • sidebar blog title: aside#sidebar .summary-title-link
  • sidebar blog date: aside#sidebar time.summary-metadata-item.summary-metadata-item–date

Work List Page (Index)

  • list page: .collection-type-index.view-list
  • item: #projectThumbs .project
  • title: #projectThumbs .project .project-title
  • image: #projectThumbs .project img

Work Detail Page (Index item)

  • detail page: .collection-type-index.view-list.index-page-open
  • image: #projectPages .project.active-project .image-list .image>img
  • titlte: #projectPages h2.project-title
  • description: .project-description
  • back to work: .page-open #projectPages .project-controls #projectNav+a
  • prev/next: .page-open #projectPages .project-controls #projectNav
  • related project: .page-open #projectThumbs .project

Homepage

  • homepage: .homepage

Shop Page

  • shop page: .collection-type-products.view-list
  • category filter: .category-nav
  • category filter item: .category-nav li a
  • product: #productList .product
  • product name: #productList .product .product-title
  • product image: #productList .product .product-image img
  • price: #productList .product .product-price

Product Detail Page

  • product detail page: .collection-type-products.view-item
  • back to products: div#productNav
  • product name: #productDetails .product-title
  • price: #productDetails .product-price
  • description: .product-excerpt
  • add to cart text: .sqs-add-to-cart-button-inner
  • add to cart button: .sqs-add-to-cart-button
  • share: .product-social-sharing .product-sharing
  • gallery image: #productGallery
  • additional descripiton: .product-description

Cart Page

  • cart page: body#cart
  • cart title: .cart-title
  • item label: span.CartTable-itemLabel-3zzV1 span
  • qty. label: span.CartTable-itemLabel-3zzV1 span
  • price label: span.CartTable-itemLabel-3zzV1 span
  • x icon: .CartTableRow-itemRemove-6Q3nP button span
  • product name: .CartTableRow-itemTitle-1MDgZ a
  • product image: .CartTableRow-imageBg-97RUm
  • qty input: input.QuantityInput-stopped-2BFKB
  • price: .CartTableRow-itemPrice-26eXS
  • subtotal label: .CartTable-subtotalLabel-3qWE9
  • subtotal price: .CartTable-subtotalPrice-2JFeD
  • checkout button: body .checkout button.CheckoutButton-checkoutButton-3yWY2
  • checkout text: body .checkout button.CheckoutButton-checkoutButton-3yWY2 span

Share this post:

Leave a Comment