Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search


Circle Member
  • Posts

  • Joined

  • Last visited

  • Days Won


Community Answers

  1. bangank36's post in making a map block sticky in an Index page with 2 columns was marked as the answer   
    #block-yui_3_17_2_1_1601407006045_59630 + .row .span-3 { position: sticky; top: 50px; } #artists-2.Index-page { overflow: visible; }
  2. bangank36's post in Can't change product title format was marked as the answer   
    .ProductItem-details h1.ProductItem-details-title { color: #fff; }
  3. bangank36's post in Gallery lightbox captions in 7.1 was marked as the answer   
    It will be easier to use javascript since it will help fetching the caption from the image/slide, that you can edit the text directly in editor. 
    But there is a trick that require more effort from you to find the slide id and manually adding the caption into custom css. Each slide has unique id that can be used to target like so

    For js solution, join this topic for previous answer
  4. bangank36's post in Seeking CSS to update color of hamburger menu icon on scrolling down the page was marked as the answer   
    did you try this
    .tweak-fixed-header .header .burger-inner>div, .header--menu-open.tweak-fixed-header header.header .burger-inner>div { background-color: red !important; } .tweak-fixed-header .shrink.header .burger-inner>div { background-color: #fff !important; }

  5. bangank36's post in Redirect to *New Page* on scroll - how to add time delay? was marked as the answer   
    $(window).scroll(function() { if ($(window).scrollTop() + $(window).height() == $(document).height()) { setTimeout(function() { window.location = "page2.html"; }, 2000); } }); try
  6. bangank36's post in Table Alignment on Squarespace was marked as the answer   
    you should add this css and modify the html of the table as follow
    #teatable .pricing { text-align: right; } #teatable .pricing-row { display: flex; } #teatable .pricing-row * { width: 33.33%; } 1. Convert this row into spans, add class pricing-row to the th/td

    2. Add class pricing to all price element (include the new span created to wrap the price in the step 1

    3. Replicate the process to all cell and row as needed

  7. bangank36's post in Removing hover animation was marked as the answer   
    .products.collection-content-wrapper .grid-item .grid-image-hover { opacity: 0 !important; }.products.collection-content-wrapper .grid-item .grid-image-cover { opacity: 1 !important; }  
  8. bangank36's post in Image hovers too high over header - how can I change? was marked as the answer   
    #collection-60f5bcdaaec3a96358db2fe9 main .page-section:first-child { padding-top: 174px; } .portfolio-hover[data-variant-hover-cover] .portfolio-hover-item-title:hover { color: #efe2d1; }
  9. bangank36's post in Adding a header to a "tag page" was marked as the answer   
    Add this to code injection
    <script> document.addEventListener('DOMContentLoaded', function() { if (location.href.indexOf("journal/tag")) { var tag = location.href.substring(location.href.lastIndexOf('/') + 1); document.querySelector("#block-60f61d06c24cc7419f80222f").innerHTML = "Posts in "+tag; } }); </script> "#block-60f61d06c24cc7419f80222f" is the block id of an empty text block you added on block page, it shared across tag and category page

  10. bangank36's post in Need to Hide price on specific product. was marked as the answer   
    .post-type-store-item#thumb-guest-package-add-ons .grid-prices { display: none; } .ProductItem .product-price { display: none; }

  11. bangank36's post in Decreasing Padding Between Sections/List was marked as the answer   
    try this
    section[data-section-id="60e7ca61bab0621613379eb8"] .user-items-list { padding-top: 5vmax !important; }
  12. bangank36's post in Reversing logo color on single page, Brine template, 7.0 was marked as the answer   
    use this filter options, since your logo is gray not black
    filter: brightness(0) invert(1);
  13. bangank36's post in Enlarge product images to full-screen, Brine, v7.0 was marked as the answer   
    custom css
    .yui3-lightbox2 .sqs-lightbox-overlay { background: #fff; }
  14. bangank36's post in Mega Menu does not display properly was marked as the answer   
    You announcement style messed with the mega menu
    .mega-menu-item .page-section { padding-top: 0 !important; }
  15. bangank36's post in Auto scroll to a section on the page after first landing was marked as the answer   
    Try settings hash url only
    location.hash = "#scroll-here"
  16. bangank36's post in Trying to get Gallery pages in Wells template to Stack, instead of Grid/Slideshow was marked as the answer   
    I made a fix on wells template demo page
    #galleryWrapper #thumbnails { height: auto !important; } #galleryWrapper #thumbnails .thumb { width: 100% !important; left: 0 !important; top: 0 !important; height: auto !important; position: relative !important; margin-bottom: 10px; }
  17. bangank36's post in CSS - 'Animated Button Gradient' not working was marked as the answer   
    The sample target small button, also I helped you target the correct button id and update the code like

  18. bangank36's post in Custom Parallax coding was marked as the answer   
    You can position:sticky to the section to achieve this
    Parallax Overlapping Sections Using Sticky Positioning - SuperLibrary – SuperHi

  19. bangank36's post in How do I make this rolling animation? was marked as the answer   
    Add this into code block
    <div class="marquee"> <div class="track"> <div class="content"><h3 style="color: #fff; text-decoration:none;"><a href="https://www.instagram.com/letstalkcodeshop" target="_blank">Follow on Instagram @letstalkcodeshop | Follow on Instagram @letstalkcodeshop | Follow on Instagram @letstalkcodeshop | Follow on Instagram @letstalkcodeshop | Follow on Instagram @letstalkcodeshop | Follow on Instagram @letstalkcodeshop | Follow on Instagram @letstalkcodeshop | Follow on Instagram @letstalkcodeshop | Follow on Instagram @letstalkcodeshop</a></h3></div> </div> </div> <style> .marquee { position: relative; width: 110vw; max-width: 100%; height: 25px; padding-top: 20px; padding-bottom:20px; overflow-x: hidden; background: #000; } .track { position: absolute; white-space: nowrap; will-change: transform; animation: marquee 32s linear infinite; } .marquee h3 a:hover { color: #fff; } @keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } } </style>  
  20. bangank36's post in Ninja Kit Typewriter effect was marked as the answer   
    You are missing jQuery, add this into first line of the header injection
    <script src="assets/js/libs/jquery-3.6.0.min.js"></script>  
  21. bangank36's post in Decreasing padding/spacing in blog between sections was marked as the answer   
    .blog-single-column .blog-meta-section { margin-bottom: 0; } .blog-single-column .blog-title { margin-bottom: 0; } .tweak-blog-single-column-width-full .blog-single-column { padding-top: 0; }  
  22. bangank36's post in Help me change the color of just one word in my website banner text page title? was marked as the answer   
    #collection-60897a4664960358b15957e0 .page-description p strong { color: green; }
  23. bangank36's post in Image block (icons) are stacking on top of text blocks on mobile view was marked as the answer   
    @media only screen and (max-width: 600px) { #new-page .span-3 { display: flex; flex-wrap: nowrap; } #new-page .span-3 .sqs-block-image { width: 20% !important; } }  
  24. bangank36's post in Capture custom form data from the inventory items to mailchip or zapier was marked as the answer   
    So far there is no buit in method to do this, yoy can either manually export product form and type in mailchimp or you can create a script for automate this task
  25. bangank36's post in Change event back button behavior and text when multiple event pages are in use was marked as the answer   
    i misread, change the string to "board-postings" to make it work
    <!-- Change board listing back button behavior --> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script> <script> jQuery(function($){ if (window.location.pathname.split('/')[1] == "board-postings") { $(".eventitem-backlink").html(function() { return $(this).html().replace("Back to All Events", "Back to listings"); }); $('.eventitem-backlink').attr('href','/board-listings'); } }); </script> <!-- end Change board listing back button behavior -->  
  • Create New...