Jump to content

tuanphan

Circle Member
  • Posts

    63,814
  • Joined

  • Last visited

  • Days Won

    511

Everything posted by tuanphan

  1. You can use List Section Banner Slideshow to achieve this. It is free (When you add a section > Choose People on the left list > Choose section with (i) icon on the right > Then edit section > Change to List Banner Slideshow). Or another way, you can add 2 sections, top is Gallery Section Slideshow, second is a Section with Text, Buttons, then share page url, we can give you code to move second section over Slideshow section.
  2. I don't know this, but if you need "hover to zoom", there is a plugin with this feature.
  3. Can you share link to page & Which exact code did you add to your site?
  4. Hi, Can you share link to page where you use video block? We can check easier
  5. The site is private, we can't access it, you can follow this guide to setup an access password.
  6. Hi, Can you share link to page where you have problems? We can check easier
  7. Hi, Can you share link to page? We can check easier
  8. Because you don't share url, so we can't check ID of section, so you can use this way (require a Business Plan or higher) First, use this code to Website > Website Tools > Code Injection > Footer <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script> <script> $(document).ready(function(){ $('.hide-on-desktop').closest('section.page-section').addClass('hide-on-desktop'); $('.hide-on-mobile').closest('section.page-section').addClass('hide-on-mobile'); }); </script> And use this code to Website Tools > Custom CSS @media screen and (min-width:768px) { section.hide-on-desktop { display: none !important; }} @media screen and (max-width:767px) { section.hide-on-mobile{ display: none !important; } } Next, add 2 sections with 2 videos To hide 1 section on desktop, edit that section > Add a Block > Choose Code > Paste this code <div class="hide-on-desktop"></div> and to hide another section on mobile, use this Code Block <div class="hide-on-mobile"></div>
  9. It looks like you added something to page so code structure changed since that time. Use this new code @media screen and (max-width:640px) { div#block-yui_3_17_2_1_1705057137277_8829+.row .span-6, div#block-yui_3_17_2_1_1693762350192_34417+.row .span-6 { width: 50% !important; float: left !important; } }
  10. Hi, Can you share link to this page? We can check easier
  11. Can you share link to page where you have problem? We can check easier
  12. Use this new code <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script> <script> $(document).ready(() => { const a = $('.eventlist-event') for (let i=0; i<a.length; i++) { const newH = $(a[i]).find("a:contains('view external url')").attr('href'); $(a[i]).find('a').click((e) => { e.preventDefault() window.open(newH) }) } }) </script> <style> .eventlist-excerpt a { display: none; } </style>
  13. Add this code to Website > 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($){ $('.item-pagination[data-collection-type^="portfolio"]').clone().insertBefore('article>section:first-child .content'); }) </script> <style> article>section:first-child .content-wrapper { flex-direction: column; } </style>
  14. To add arrow to add to cart button, use this CSS code /* add to cart arrow */ .sqs-add-to-cart-button-inner:after { content: ''; background-image: url(https://static1.squarespace.com/static/65aea6afe369c462cb5c6f5c/t/65b01b88b692bc3ce4db1003/1706040200816/arrow-slanted.png); background-size: contain !important; background-position: center; float: right; background-repeat: no-repeat; color: transparent; object-fit: cover; width: 17px; height: 23px; margin-left: 15px; transition: all .4s ease-in-out 0s; -moz-transition: all .4s ease-in-out 0s; -ms-transition: all .4s ease-in-out 0s; -o-transition: all .4s ease-in-out 0s; -webkit-transition: all .4s ease-in-out 0s; } .sqs-add-to-cart-button-inner:hover:after { transform: rotate(45deg); }
  15. You try edit Site Footer > Add a block > Choose Markdown > Then paste the code or try disable Ajax Loading in Design
  16. Hi, With size, you can use this code to Website > Website Tools (under Not Linked) > Custom CSS h2.item-pagination-title { font-size: 20px !important; } With move to top, you need to share link to your portfolio page, we can check easier
  17. You can adjust number 2 If it doesn't work, please share link to your site, we can check easier
  18. You can achieve this but requires a custom plugin First, install Section Loader Supreme Plugin (affiliate link) or this link (non-affiliate link) Next, create a page in Not Linked Name: Reuse Newsletter URL Slug: /reuse-newsletter Next, edit page and add a Newsletter Block Final, edit blog post where you want to place Newsletter > Add a Block > Choose Code > Paste this code <div data-wm-plugin="load" data-target="/reuse-newsletter"></div> Bonus In case you want to add a newsletter to all blog posts, above Pagination, you can use this code to Post Blog Item Code Injection <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script> <script> $(document).ready(function(){ setTimeout( function() { $('div.wm-load-container').insertBefore('body[class*="type-blog"].view-item section#itemPagination'); }, 3000); }); </script> Result
  19. First, change your layout to mobile Next, click on Burger icon >> A box will appear, you can edit burger icon here
  20. Try click Edit Site Header >> Then hover on bottom right of header, maybe you will see a button "Edit Design" or something similar.
  21. Just a curious, I see you are using 2 text blocks over image, why don't you use 1 Text Block only?
  22. --site-navigaion-font-family means apply navigation font name for all text in Footer. In case you want to use a different font name, use this code instead footer.sections * { font-family: monospace !important; } Yes, add to Website > Website Tools > Custom CSS
×
×
  • 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.