Jump to content

tuanphan

Circle Member
  • Posts

    63,866
  • Joined

  • Last visited

  • Days Won

    511

Everything posted by tuanphan

  1. You want left is carousel section right is a regular section and do this on desktop only Is this right?
  2. First, add this code to Website Tools (under Not Linked) > Code Injection > Footer <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script> <script> $(document).ready(function(){ $('figure[class*="gallery-"] video').closest('figure').addClass('hide-image'); }); </script> Next, this code to Website Tools > Custom CSS /* hide gallery section images */ .hide-image [class*="-item-wrapper"] { display: none !important; } Edit Gallery Section > Edit each image > Paste the code similar this (replace example mp4 with new video url) <video width="100%" height="240" controls> <source src="https://www.w3schools.com/tags/movie.mp4" type="video/mp4"> </video> these code will replace image with video, so the result
  3. Your code (line 3 - line 5) affects Cart Page only What is site url?
  4. If you share link to page where you have problem, we can check easier
  5. Try this body#collection-657791290079e95e3a217954 article * { transition-delay: unset !important; transition: unset !important; }
  6. Can you share link to a page where you use uppercase h1/h2? We can check easier
  7. It looks fine to me. You can keep the code, I can check easier To add line between categories, add this code to Website Tools > Code Injection > Footer <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script> <script> jQuery(document).ready(function($){ $('<span class="breadcrumb-separator" aria-hidden="true">|</span>').insertAfter('li.category-item a'); }) </script> <style> @media screen and (min-width:768px) { li.category-item .breadcrumb-separator { display: none !important; } } @media screen and (max-width:767px) { li.category-item { display: flex; align-items: center; } a.category-link { padding-right: 10px !important; } } </style>
  8. You mean move this text to accordion? and which accordion item?
  9. #1. No way to get login box to a fullpage, you can consider changing popup to fullscreen...we can give the code #2. Change this code <style> .header-display-desktop span.unauth { font-size: 0 } .header-display-desktop span.unauth:before { content: "\e7fd"; font-family: 'Material Symbols Outlined'; font-size: 30px; position: relative; left: -2px; top: 10px } </style> to this code <style> .header-display-desktop span.unauth, .header-display-desktop span.auth { font-size: 0 } .header-display-desktop span.unauth:before, .header-display-desktop span.auth:before { content: "\e7fd"; font-family: 'Material Symbols Outlined'; font-size: 30px; position: relative; left: -2px; top: 10px } </style>
  10. Add this code under /* For desktop */ @media screen and (min-width:768px) { figcaption.gallery-caption.gallery-caption-fullscreen-slideshow * { font-size: 40px !important; color: #f1f !important; } } /* For mobile */ @media screen and (max-width:767px) { figcaption.gallery-caption.gallery-caption-fullscreen-slideshow * { font-size: 10px !important; color: white !important; } }
  11. Hi, It shows fine to me. Windows/Chrome
  12. Your code, you need to add to Custom CSS
  13. @benkl use this CSS @media (max-width: 959px) { .vc_row[id="344"] .row-parent { background-color: rgba(0,0,0,0.9) !important; } }
  14. You can add this to Website Tools (under Not Linked) > Custom CSS .user-items-list-item-container[data-section-id="6582d8ff86c8db2c2e5e0949"] .user-items-list-carousel__arrow-icon-holder { align-items: flex-start !important; }
  15. You can edit page (any pages) > Click Site Styles icon on top right of screen > Fonts Then click on Button on Left Side > Right Side will show correct box where you can change button text size or if you want to use custom code, add this code to Website Tools (under Not Linked) > Custom CSS a.btn { font-size: 10px !important; }
  16. You can do 2 sections in Footer, then use some code like this to hide 1 on desktop, hide 1 on mobile /* hide section 1 on desktop */ @media screen and (min-width:768px) { footer.sections section:nth-child(1) { display: none !important; } } /* hide section 2 on mobile */ @media screen and (max-width:767px) { footer.sections section:nth-child(2) { display: none !important; } }
  17. To apply other items, just repeat the code, replace with item url
  18. Add this code to Website Tools (under Not Linked) > Code Injection > Footer <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script> <script> jQuery(document).ready(function($){ $('.header-display-desktop .header-actions--left').insertBefore('.header-actions--right .header-actions-action'); }) </script> <style> .header-display-desktop .header-actions--left { flex: unset !important; max-width: unset !important; } .header-actions--right .showOnDesktop { display: flex; align-items: center; } </style>
×
×
  • 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.