Jump to content

tuanphan

Circle Member
 View Profile  See their activity

  • Posts

    64,819

  • Joined

  • Last visited

  • Days Won

    517

 Content Type 

Everything posted by tuanphan

  1. tuanphan
    Hi, This will require JavaScript code (Business Plan or higher). Can you share link to page in screenshot?
  2. tuanphan
    Hi, What is site url?
  3. tuanphan
    You mean Left FB icon - Middle Logo - Right button?
  4. tuanphan
    Add to Design > Custom CSS body.homepage .summary-item { width: 22.0496% !important; margin-bottom: 3.93391% !important; margin-right: 3.93391% !important; } body.homepage .summary-item:last-child { margin-right: 0 !important; }
  5. tuanphan
    What should it look like?
  6. tuanphan
    Add to Design > Custom CSS @media screen and (max-width:767px) { .ProductItem-nav .ProductItem-nav-breadcrumb, .ProductItem-nav { display: flex !important; } .hidden-sm-down { display: block !important; width: 100% !important; } }
  7. tuanphan
    Add to Design > Custom CSS div#block-yui_3_17_2_1_1675108119933_6116 { width: 100vw; left: 50%; transform: translateX(-50%); } section.Main-content { padding-top: 0px; } body { overflow-x:hidden; }
  8. tuanphan

    Sticky section

    tuanphan replied to NGM's topic in Code Blocks

    use this [data-section-id="63e6637613db3f494e7aa702"] { position: sticky; position: -webkit-sticky; top: 70px; z-index: 999999; } /* tablet */ @media screen and (max-width:1024px) and (min-width:768px) { [data-section-id="63fe4c0f075efc4020c6faf4"] { top: 82px !important; } }
  9. tuanphan
    Can you share link to page where you added Image Block with link? We can help easier
  10. tuanphan
    Use this @media screen and (max-width:767px) { .user-items-list-item-container[data-section-id="63fcaf3b6a9d921f53ad978d"] { .slide-content h2.list-item-content__title { font-size: 8px !important; } .list-item-content__description * { font-size: 30px !important; } } }
  11. tuanphan
    It is complex effect, so difficult to get help here. You can consider hiring a dev to help with this If you still want free, you try find a free code on Codepen.io, then share link, we can convert it to Squarespace
  12. tuanphan
    Which page are you referring to? I don't see header logo on homepage
  13. tuanphan
    Add to Design > Custom CSS /* remove header button on thank you page */ body#collection-63ffc4836f5e3d220168d985 header#header a.btn { display: none; }
  14. tuanphan
    Which section are you referring to? Can you take a screenshot?
  15. tuanphan
    Use thsis new code <script> (function docReady(fn) { // see if DOM is already available if (document.readyState === "complete" || document.readyState === "interactive") { // call on next available tick setTimeout(fn, 1); } else { document.addEventListener("DOMContentLoaded", fn); } })(() => { if ( window.location == window.parent.location ) { const reelControl = document.querySelector('.gallery-reel-control [aria-label="Next Slide"]'); if (reelControl) { (function reelTimer() { setTimeout(() => { reelControl.click(); reelTimer(); }, 2000); // change this value to change the speed })(); } } }); </script>
  16. tuanphan
    Use this new code body[class*="type-products"].view-item, body#cart { header#header { background-image: url(https://images.squarespace-cdn.com/content/v1/63b5ed5e58d111590903192a/1675045798337-L6JIEQJ1X5MNT60CQZ96/unsplash-image-z7rzbFHXym0.jpg?format=original); background-size: cover; background-repeat: no-repeat; } header#header .header-nav-item *, header#header span, header#header svg { color: white; } }
  17. tuanphan
    I see you solved with this code? @media screen and (min-width: 1200px) { div#grid { height:auto !important } #grid .item { position: relative !important; transform: unset !important; top: unset !important; left: unset !important; width: 100% !important; height: auto !important } }
  18. tuanphan
    Try adding to Design > Custom CSS @media screen and (min-width:768px) { body#collection-63e3ca963a2e9b3f9a400188 .gallery-reel-controls { bottom: 50px !important; } }
  19. tuanphan
    Can you share link to this page? We can check easier
  20. tuanphan
    You mean something like this? https://thung.squarespace.com/list-section-readmore-readless?noredirect pass: abc Or if you share link to your site, we can check code block problem
  21. tuanphan
    You mean opacity of this box?
  22. tuanphan
    Add this to Design > Custom CSS .instagram-block .sqs-video-wrapper .sqs-video-overlay { border-radius: 20px; }
  23. tuanphan
    Hi, What is site url?
  24. tuanphan
    Change your code to this <img src=""> <ul class="t-list"> <li class="item" data-image="https://ct112013.files.wordpress.com/2013/07/pasteeel.jpg">WOMAN</li> <li class="item" data-image="https://i.pinimg.com/736x/1a/e9/ff/1ae9ff68eddb75113cc797f1324515b9--color-coordination-reiss.jpg">MAN</li> <li class="item" data-image="http://www.todaysparent.com/wp-content/uploads/2014/02/Mint1.jpg">KID</li> </ul> <style> ul.t-list { list-style: none; padding: 0; margin: 0; position: relative; } ul.t-list li { font-family: "Belleza", sans-serif; position: relative; font-size: 80px; text-align: center; -webkit-text-stroke: 1px black; color: transparent; margin-bottom: 40px; z-index: 1; } .t-list img { position: absolute; width: 30%; object-fit: contain; transform: translateX(-50%) translateY(-50%); top: 50%; left: 50%; z-index: 10; } </style> <script> const items = document.querySelectorAll('.item') const image = document.querySelector('.t-list img') items.forEach((el) => { el.addEventListener('mouseover', (e) => { imageData = e.target.getAttribute('data-image') console.log(imageData) e.target.style.zIndex = 99 image.setAttribute('src', imageData) }) el.addEventListener('mousemove', (e) => { image.style.top = e.clientY + 'px' image.style.left = e.clientX + 'px' }) el.addEventListener('mouseleave', (e) => { e.target.style.zIndex = 1 image.setAttribute('src', '') }) }) </script>
  25. tuanphan
    Use this new code /* Force desktop menu on Tablet - Version 1 */ @media screen and (max-width:991px) { .header-display-desktop { display: flex !important; } .header-display-mobile { display: none; } .header-burger { display: none; } .header-nav { display: flex !important; } .header-nav { display: flex !important; flex: 70% !important; justify-content: flex-end; width: 70% !important; } .header-title { flex: 50% !important; } .showOnMobile .header-actions-action.header-actions-action--cart { display: none; } }
×
×
  • Create New...

Squarespace Webinars

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

Upcoming Webinars →

Hire a Designer

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

Get Matched →

Support

Community

Developers

Resources