-
Posts
64,655 -
Joined
-
Last visited
-
Days Won
516
Community Answers
-
tuanphan's post in Check Boxes was marked as the answer
Try adding to Design > Custom CSS
.form-wrapper .field-list .field.radio label { padding-left: 20px; } .form-wrapper .field-list .field.checkbox label { text-indent: 20px; }
-
tuanphan's post in I want to change the color & stroke color of a shape. was marked as the answer
Try adding to Design > Custom CSS
.fe-block.fe-block-yui_3_17_2_1_1687411151619_20479 .sqs-block-shape svg.sqs-shape { fill: transparent; stroke: transparent; border: 1px solid white; border-radius: 50%; }
-
tuanphan's post in How do you exclude a specific page from your Custom CSS rules was marked as the answer
Change your code to this
body:not(#collection-5e815582abb56b3bf61d9204) #page { background-image:url(https://static1.squarespace.com/static/5e8153bfb44957431114ef44/t/649ca8eb65c764054e3a0785/1687988460154/Blue+Background.jpg); background-size: cover; } body:not(#collection-5e815582abb56b3bf61d9204) .section-border{ opacity:0 !important; }
-
tuanphan's post in Navigation background color change on hover fill to full width of dropdown menu was marked as the answer
Don't remove any code in your current code. Add this to Design > Custom CSS
div.header-nav-folder-content { padding: 0 !important; } div.header-nav-folder-content div a { padding: 0.5em 1em !important; }
-
tuanphan's post in How To Remove Mobile Audio UI? was marked as the answer
You try adding this to Code Injection > Footer to prevent audio open in new tab in iOS
<script> window.addEventListener("load", function(){ Y.UA.ios = 0; }) </script>
-
tuanphan's post in Adjust section height on mobile view was marked as the answer
Use this CSS code
@media screen and (max-width:640px) { section#about-cta>div { margin-bottom: 0px !important; padding-top: 0px !important; padding-bottom: 0px !important; } section#about-cta { min-height: unset !important; } }
-
tuanphan's post in Change form field font size to all the same was marked as the answer
You can add this to Design > Custom CSS
div.form-block textarea { font-size: 12px !important; }
-
tuanphan's post in Adjust spacing of specific items on mobile drop-down menu was marked as the answer
Add to Design > Custom CSS
a.Mobile-overlay-folder-item[href="/coasters"], a.Mobile-overlay-folder-item[href="/jugs"] { margin-bottom: 40px; }
-
tuanphan's post in Change wording for "all categories" in video blogs was marked as the answer
Add to Design > Custom CSS
li.nested-category-breadcrumb-list-item:first-child a { font-size: 0; } li.nested-category-breadcrumb-list-item:first-child a:before { content: "new all"; font-size: 16px; }
-
tuanphan's post in Can I mimic a Portfolio page with a Gallery? was marked as the answer
Yes. Try adding this to Design > Custom CSS (this code for first item)
/* hide button */ .fe-block-1f76a031e45292b28925 { opacity: 0; transition: all 0.3s; } .fe-block-1f76a031e45292b28925:hover { opacity: 1; transition: all 0.3s; }
-
tuanphan's post in HELP - Style "Continue Shopping" button in cart was marked as the answer
Add to Design > Custom CSS
/* Continue shopping button */ a.cart-continue-button { color: white !important; }
-
tuanphan's post in HELP - Style "checkout" button was marked as the answer
Use this
/* Continue shopping button */ a.cart-continue-button { color: white !important; font-family: monospace !important; font-size: 30px !important; color: #f1f !important; }
-
tuanphan's post in Move Video Blocks behind other layers with z-index was marked as the answer
Add this to Design > Custom CSS
[data-section-id="63e6579c5fb90602c9a2451a"] { z-index: 999 !important; }
-
tuanphan's post in 13 images in a row in a Gallery Grid? was marked as the answer
Use this code
@media screen and (min-width:768px) { div#block-yui_3_17_2_1_1665709504528_279294 .slide { width: 100% !important; float: none !important; } #block-yui_3_17_2_1_1665709504528_279294 .sqs-gallery-block-grid .sqs-gallery-design-grid { display: grid; grid-template-columns: repeat(11,minmax(0,1fr)); } }
-
tuanphan's post in Adding categories to main navigation was marked as the answer
I miss a - symbol. Use this new code
<script> if (document.location.pathname.indexOf("/shop/manufacturing") == 0) { document.querySelector('body').classList.add('t-active') } if (document.location.pathname.indexOf("/shop/supply") == 0) { document.querySelector('body').classList.add('t-active') } </script> <style> body.t-active header#header [href*="/shop/manufa"], body.t-active header#header [href*="/shop/supply"] { border-bottom: 1px solid; } </style>
-
tuanphan's post in Changing the color of nav links by page. was marked as the answer
Add this code to Design > Custom CSS
/* Contact - UI UX Design */ body#collection-609b07dde06290237a7ecc4a, body#collection-609c253783d1f50d196b9ed3 { header#header nav div.header-nav-item a { color: white !important; } div.burger-inner>div { background-color: white !important; } }
-
tuanphan's post in I need help fixing lightbox error on product page was marked as the answer
Add this code to Design > Custom CSS
.ProductItem-additional .image-block { pointer-events: none; }
-
tuanphan's post in How to Prevent Text Splitting On Mobile View was marked as the answer
Try this CSS code
p,h1,h2,h3, body * { -webkit-hyphens: manual !important; -moz-hyphens: manual !important; -ms-hyphens: manual !important; hyphens: manual !important }
-
tuanphan's post in How do I put blog categories in a drop down menu on mobile only? was marked as the answer
Add to Design > Custom CSS
body.homepage .accordion-item__description { max-width: 100% !important; text-align: center !important; } body.homepage .accordion-icon-container { position: relative; left: -50px; }
-
tuanphan's post in Changing the text 'Email Address' in the newsletter was marked as the answer
Add to Settings > Advanced > Code Injection > Footer (Or Settings > Developer Tools > Code Injection > Footer)
<script> (function() { document.querySelector(".email input").setAttribute("placeholder", "Email"); })() </script>
-
tuanphan's post in How to move the 'add to cart button' and any variants to below the product title was marked as the answer
Add to Design > Custom CSS
/* product info order */ .ProductItem-details .ProductItem-details-checkout { display: flex !important; } .product-quantity-input { order: 1 !important; } .sqs-add-to-cart-button-wrapper { order: 2 !important; } .ProductItem-product-price { order: 3 !important; } .ProductItem-details-excerpt { order: 4 !important; }
-
tuanphan's post in Need help to invert logo on portfolio subpage was marked as the answer
Edit KP11 and KP15 Pages > Add a Code Block (top or bottom page) > Then paste the code
<style> header#header img { -webkit-filter: invert(100%); filter: invert(1); } </style>
-
tuanphan's post in Reduce masonry grid gallery to 1 column on mobile, Squarespace 7.1 Fluid Engine was marked as the answer
Use this CSS code
/* Masonry to grid mobile */ @media screen and (max-width:767px) { .gallery-masonry-wrapper.gallery-masonry-list--ready { height: auto !important; display: grid; grid-template-columns: repeat(1,1fr) !important; grid-column-gap: 10px; grid-row-gap: 10px; } figure.gallery-masonry-item { position: relative !important; width: 100% !important; transform: unset !important; } .gallery-masonry-item-wrapper { height: 100% !important; } figure.gallery-masonry-item img { width: 100% !important; } }
-
tuanphan's post in I want to know how to customize the text area - placeholder of the form block. was marked as the answer
#1. Add to Design > Custom CSS
/* textarea placeholder */ div#block-6303831bb899d1c9dd318887 textarea::placeholder { color: white; } #2. #3. It looks like you solved?
-
tuanphan's post in I want to change the position of the list section text title. was marked as the answer
Add to Design > Custom CSS
@media screen and (min-width:768px) { body.homepage .list-item-content { position: absolute; right: -10px; top: 20px; z-index: 99999; } }