Jump to content

kellyhutsbydesigns

Circle Member
  • Posts

    33
  • Joined

  • Last visited

Reputation Activity

  1. Like
    kellyhutsbydesigns reacted to tuanphan in My website cannot scroll up or down smoothly after hidden overflow   
    Use this new code
    body { overflow-x: hidden; }  
  2. Like
    kellyhutsbydesigns reacted to creedon in Hide section inside a page based on a date/time   
    That should be doable. Give me several days to see what I can come up with.
    Another question. Are the users of the site only going to be local or do you expect folks from other time zones to want to buy products? I ask because working with time zones is a nightmare on computers. It hurts my brain! 🙂
  3. Like
    kellyhutsbydesigns reacted to creedon in Hide section inside a page based on a date/time   
    Please see Store Product Detail Add To Cart Show After Date Time.
    Note this code takes care of hiding the atc buttons for you. This code hides all atc buttons and then decides to show or not.
    Remove any existing atc button hiding code you have.
    Let us know how it goes.
  4. Like
    kellyhutsbydesigns reacted to tuanphan in Delayed image loading for faster page loads.   
    I purchased this plugin to help a friend. 
    He has 40-50 galleries with hundreds of images on a page, the site loads very slowly. With the plugin, the speed has improved significantly, but still a bit slow.
  5. Like
    kellyhutsbydesigns reacted to tuanphan in Customizing button in header nav   
    Add to Home > design > Custom CSS
    .header-actions-action .btn { padding: 20px 30px; font-size: 15px; color: red !important; background: green !important; border-color: violet !important; }  
  6. Like
    kellyhutsbydesigns got a reaction from paul2009 in JS edit to add 'This is a past event' message to all past events   
    Fabulous! Thank you so much! 
  7. Love
    kellyhutsbydesigns reacted to paul2009 in JS edit to add 'This is a past event' message to all past events   
    The JS is looking for the first element with the class event-date (the start date) but it needs to look for the second element with this class (the end date). You can do this by changing the line:
    var eventDate = document.getElementsByClassName("event-date")[0].getAttribute("datetime"); to
    var eventDate = document.getElementsByClassName("event-date")[1].getAttribute("datetime"); Did this help? Please give feedback by clicking an icon below  ⬇️
  8. Like
    kellyhutsbydesigns got a reaction from tuanphan in Automatically display text when summary block is empty   
    Thanks so much @paul2009
    This didn't work for me using the section ID, but it did with the block ID...
    <div id="no-events"></div> <script>   window.addEventListener('DOMContentLoaded',function () {     var sfSummaryExists = document.querySelector("#block-yui_3_17_2_1_1639337200029_6221 .summary-title");     if (sfSummaryExists == null) {         document.getElementById('no-events').innerHTML = "Sorry, we don't currently have any guided tours upcoming.";     }   });     </script> @iamdavehart Sorry - have only just seen your reply! Great suggestion, will test this one too and report back. Thanks guys!
  9. Like
    kellyhutsbydesigns reacted to paul2009 in Automatically display text when summary block is empty   
    Instead of looking for a single class of summary-title like this:
    document.getElementsByClassName("summary-title")[0] you'll need to look for each class within each section. For example, where the section ID is wxyz, you might use:
     
    document.querySelector("section[data-section-id="wxyz"] .summary-title")  
  10. Like
    kellyhutsbydesigns reacted to paul2009 in Automatically Display Text on Summary Block When Empty (Events)   
    As your site is on Squarespace 7.1, you need to replace the YUI with plain JS. Here's the updated guide that I wrote:

  11. Like
    kellyhutsbydesigns reacted to genelu in How to vertically center caption over a Gallery image for SS 7.1?   
    I think I figured it out. Again, super rusty w/ CSS, but here's what I did. Hope this helps!
    /* Make sure to target your gallery. Each gallery has its own unique collection ID, which can be found via View Source. */ #collection-5f047ea7c17ab563ed1595c4{ .gallery-grid-item { position: relative; display: inline-block; } .gallery-caption-wrapper { display: table; height: 100%; } /* Caption Container */ figcaption.gallery-caption { padding: 0; position: absolute; z-index: 999; margin: 0 auto; left: 0; right: 0; top: 0%; width: 100%; height: 100%; } .gallery-caption-content { display: table-cell; vertical-align: middle; } }  
  12. Like
    kellyhutsbydesigns got a reaction from tuanphan in [Share] Squarespace 7.1 CSS ID List   
    I've fixed the above!
     
  13. Love
    kellyhutsbydesigns reacted to tuanphan in [Share] Squarespace 7.1 CSS ID List   
    Some CSS Class/ID for Squarespace 7.1
    Announcement Bar
    Announcement bar: .sqs-announcement-bar-dropzone Announcement bar text: .sqs-announcement-bar-dropzone p Announcement bar link: .sqs-announcement-bar-dropzone a Announcement Bar Close Icon: .sqs-announcement-bar-close OR .sqs-announcement-bar-close:after Header
    Header: header#header Sticky Header: header.shrink Header (not include sticky header): header#header:not(.shrink) Header (when burger menu is open): body.header--menu-open header#header Header (when burger menu is close): body:not(.header--menu-open) header#header Site Title: a#site-title Site Title (when overlay menu open): .header--menu-open a#site-title Site Title (when overlay menu close) body:not(.header--menu-open) a#site-title Navigation: .header-nav Navigation Items: .header-nav-item a Navigation First Item: .header-nav-item:nth-child(1) a Navigation Second Item: .header-nav-item:nth-child(2) a Navigation Dropdown: .header-nav-folder-content Navigation Dropdown Items: .header-nav-folder-item a Navigation Folder Title: a.header-nav-folder-title Mobile Navigation Items: .header-menu-nav-item a Mobile Navigation First Item: .header-menu-nav-folder[data-folder="root"]>div>div:first-child Mobile Navigation First Item (text): .header-menu-nav-folder[data-folder="root"]>div>div:first-child a Mobile Navigation Second Item: .header-menu-nav-folder[data-folder="root"]>div>div:nth-child(2) Mobile Navigation Second Item (text): .header-menu-nav-folder[data-folder="root"]>div>div:nth-child(2) a Mobile Menu Icon: .header-burger Mobile Burger 3 lines: .burger-inner>div Mobile Menu X icon: body.header--menu-open .burger-inner>div Header Social Icons: .header-actions .icon Cart Icon: header#header span.Cart-inner Cart quantity: header#header .icon-cart-quantity Header Button: header#header a.btn Header Desktop Button: .header-display-desktop a.btn Header Mobile Button: .header-menu-cta a a Footer
    Footer: footer#footer-sections Footer Social Icons:  footer#footer-sections  .sqs-svg-icon–outer Footer Links: footer#footer-sections a Product List
    Product List: .collection-type-products.view-list Product Name: .grid-title Product Price: .grid-prices Product Image: figure.grid-image Product Currency: body.native-currency-code-usd .sqs-money-native:before Sold Out Text: .product-mark.sold-out Product Detail
    Product Detail: .collection-type-products.view-item Product Breadcrumb: .ProductItem-nav-breadcrumb Product Pagination (Previous/Next): .ProductItem-nav-pagination Gallery: figure.ProductItem-gallery Thumbnails: .ProductItem-gallery-thumbnails Big Image: .ProductItem-gallery-slides Product Name: h1.ProductItem-details-title Price: .ProductItem-product-price Currency: body.native-currency-code-usd .sqs-money-native:before Excerpt: .ProductItem-details-excerpt Add to Cart Button: .sqs-add-to-cart-button-wrapper Add to Cart Text: .sqs-add-to-cart-button-inner Variant Dropdown: .variant-option Variant Title: .variant-option-title Variant Options: .variant-select-wrapper option Quantity Text: .quantity-label Quantity Input: .product-quantity-input Cart Page
    Cart Page: body#cart Cart Page Title: .cart-title Product Name: a.cart-row-title Product Thumbnail: div.cart-row-img Qty minus: .cart-row-qty-dec Qty plus: button.cart-row-qty-inc Qty number: input.cart-row-qty-input Price: .cart-row-price X icon: .cart-row-remove or .cart-row-remove svg Sub total text: .cart-subtotal-label span Sub total price: .cart-subtotal-price Checkout Button: button.cart-checkout-button   Item: .CartTable-itemLabel-3zzV1 QTY. .CartTable-itemLabel-3zzV1 span Price Name: .CartTable-itemPrice-XgjsO span X icon: .item-remove div Blog List
    Blog List: [class*="type-blog"].view-list Thumbnails: article.blog-item img Date: time.blog-date Category: span.blog-categories-list Title: h1.blog-title Excerpt: .blog-excerpt Read more: a.blog-more-link Blog Posts
    Blog Posts Page: [class*="type-blog"].view-item Blog Items: .blog-item-entry Categories: .blog-meta-item–categories Date: time.dt-published.blog-meta-item.blog-meta-item–date Author: .blog-meta-item.blog-meta-item–author.p-author.author Title: .blog-item-title Content: .blog-item-content-wrapper Pagination: .item-pagination Pagination Arrows: .item-pagination-link .item-pagination-icon Pagination Title: h2.item-pagination-title Author Box: .blog-item-author-profile-wrapper Author Image: a.author-avatar.content-fill Author Name: .author-name Author Site: a.author-website Post Comment: .squarespace-comments Post Comment Button: .comment.btn Comment Input: .squarespace-comments .new-comment-area Preview: span.btn-text.preview-comment.top-level-preview-btn Subscribe via email text: span.subscribe.subscribe-control Blog Grid
    updating
    Blog Masonry
    updating
    Event List Page
    Event List Page: .collection-type-events.view-list Event Thumbnail: a.eventlist-column-thumbnail.content-fill Event Time: .eventlist-datetag Event Date: .eventlist-datetag-startdate.eventlist-datetag-startdate–day Event Month: .eventlist-datetag-startdate.eventlist-datetag-startdate–month Event Title: h1.eventlist-title Event Hour: li.eventlist-meta-item.eventlist-meta-time.event-meta-item Event Description: .eventlist-description Event Detail Page
    Event Detail Page: .collection-type-events.view-item Event Title: h1.eventitem-title Event Date: time.event-date Event Hour: li.eventitem-meta-item.eventitem-meta-time.event-meta-item Event Description: .eventitem-column-content Event Pagination: section.item-pagination.item-pagination–prev-next Previous/Next: .item-pagination-link .item-pagination-prev-next Event Pagination Title: h2.item-pagination-title Portfolio
    title: h3.portfolio-title item: .portfolio-grid-basic portfolio image: .portfolio-grid-basic .grid-image pagination: [data-collection-type=“portfolio-grid-basic”].item-pagination pagination text: h2.item-pagination-title pre text: .item-pagination-link–prev .item-pagination-prev-next next text: .item-pagination-link–next .item-pagination-prev-next List Simple
    List Simple: .user-items-list-simple Image: .user-items-list-simple img First Item: .user-items-list-simple li:nth-child(1) Second Item: .user-items-list-simple li:nth-child(2) List Content: .user-items-list-simple .list-item-content Title: .user-items-list-simple h2.list-item-content__title Description:  .user-items-list-simple list-item-content__description OR .user-items-list-simple p List Slideshow
    List Slideshow: .user-items-list-banner-slideshow Image: .user-items-list-banner-slideshow img First Item: .user-items-list-banner-slideshow li:nth-child(1) Second Item: .user-items-list-banner-slideshow li:nth-child(2) List Content: .user-items-list-banner-slideshow .slide-content Title: .user-items-list-banner-slideshow h2.list-item-content__title Description:  .user-items-list-banner-slideshow list-item-content__description OR .user-items-list-banner-slideshow p Arrow Circles: .user-items-list-banner-slideshow .user-items-list-banner-slideshow__arrow-button Arrow Icons: .user-items-list-banner-slideshow .user-items-list-banner-slideshow__arrow-button svg Button: .user-items-list-banner-slideshow .list-item-content__button List Carousel
    List Carousel: .user-items-list-carousel__slides Image: .user-items-list-carousel__slides img First Item: .user-items-list-carousel__slides li:nth-child(1) Second Item: .user-items-list-carousel__slides li:nth-child(2) List Content: .user-items-list-carousel__slides .list-item-content Title: .user-items-list-carousel__slides h2.list-item-content__title Description:  .user-items-list-carousel__slides list-item-content__description OR .user-items-list-carousel__slides p Arrow Circles: .user-items-list-carousel__arrow-button Arrow Icons: .user-items-list-carousel__arrow-button svg Button: .user-items-list-carousel__slides .list-item-content__button Fluid Engine
    Fluid Block (text block, image...): Each block is wrapped by the same class name .fe-block and a unique id. And All .fe-blocks will be wrapped by a parent tag with a class name of .fluid-engine
     
    Checked & Wrote by tuanphan
  14. Thanks
    kellyhutsbydesigns reacted to tuanphan in Decreasing Section Padding Squarespace 7.1   
    Try this
    [data-section-id="5e8f4059a780b645bb8468ac"] { min-height: 10vh !important; } [data-section-id="5e8f4059a780b645bb8468ac"] .content-wrapper { padding-top: 2px !important; padding-bottom: 2px !important; }  
×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.