tuanphan

Can you share link to page where you added it? We can check easier

Hi,

Can you share link to product where you have problem?

Hi,

Can you share link to this page? We can check easier

You can use Well Template to achieve this. In case you are using 7.1 version, you can share link, we can give code to achieve similar layout

On 7/23/2023 at 2:41 PM, Kellyx10 said:

@tuanphan Sorry, I accidentially revised the url name. Here it is: https://www.the-plucx.com/works 

I have the same requirement about the semi-clear overlay with white-text tile on blog grid thumbnails.

For PC views ↓

Initial: show image, hide title

Hover: show image, show title (over image), show an overlay over image

For Mobile views ↓

Initial: show image, show title

Hover: show image, show title (below image), show an overlay over image

 

Your kind help will be truly appreciated.

Add to Design > Custom CSS

/* Blig List - Hover Effect */
@media screen and (min-width:992px) {
.blog-basic-grid--text {
    position: absolute;
    top: 50%;
    left: 50%;
    text-align: center;
    transform: translate(-50%,-50%);
    opacity: 0;
    transition: all 0.3s;
}
article.blog-basic-grid--container.entry.blog-item.is-loaded {
    position: relative !important;
    transform: unset !important;
}
.blog-basic-grid article:hover .blog-basic-grid--text {
    opacity: 1;
    transition: all 0.3s;
}

.blog-basic-grid .image-wrapper:after {
    content: "";
    background-color: rgba(255,255,255,0.75);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: all 0.3s;
}

.blog-basic-grid article:hover .image-wrapper:after {
    opacity: 1;
    transition: all 0.3s;
}

.blog-basic-grid .image-wrapper {
    position: relative;
}}

On 7/23/2023 at 4:08 PM, svanholm said:

Hello

This is the link to the page: https://www.sagospegeln.se/butik/p/milk-dip-cup-92wf6-7jbr7

I now have two buttons on this product page. One for uploading some data, and one for adding the product to the cart. This is obviously a bad idea. I want to remove the first button "Skicka in" (I know how to), and make it so that the "Lägg i kundvagnen"-button also runs the first buttons function.

This is what I have currently injected in the footer. The first part is changing the location of some stuff.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
<script>
  $(document).ready(function() { 
    $('section.ProductItem-additional').insertBefore('.product-variants');
    });
  
  $("#yui_3_17_2_1_1690040888674_281").on("click", 
                      function(e){
                        alert("Hello");                      
    });
</script>

I think the idea of second part of the code is correct, but it is not working - I am not getting an alert. Is the ID of the button wrong? If only I can get an alert, I think I can add the first buttons functionality.

Hi,

This is not possible. You can consider using custom product form

https://support.squarespace.com/hc/en-us/articles/205811218-Creating-a-custom-product-form

and use this guide to add upload field to form

• https://kerstinmartin.com/blog/file-upload

• https://www.squarewebsites.org/blog/squarespace-websites-uploader

I don't see content on About/Resume pages. Can you add some random?

On 7/24/2023 at 2:31 PM, Flinx said:

Hi there,

When I'm using this code, it only hides my "older posts" but doesnt add the new name. Can you help me figure out what I'm missing?

https://www.loffpublishing.com/boger

Password: LoffogFlinx

 

/* Newer posts */
nav.blog-list-pagination .prev-label {
    visibility: hidden;
}
nav.blog-list-pagination .prev-label:before {
    visibility: visible;
    content: "New prev text";
}
/* Older posts */
nav.blog-list-pagination .next-label {
    visibility: hidden;
}
nav.blog-list-pagination .next-label:after {
    visibility: visible;
    content: "new next text";
}

 

I don't see Older Post. Can you take a screenshot?

Hi,

Can you share link to homepage?

Hi,

What is your site url? We can help easier

On 7/23/2023 at 6:46 AM, TRBZINK said:

i am having the same problem, with categories not showing in the header, the solution above is not working? and i configured the code to use the /shop/abode like my site categories. https://conch-platinum-mf8h.squarespace.com/

 

What is access password?

Can you share link to page where you added it? I think we can use some code to make it center

On 7/22/2023 at 9:03 PM, weecancuk said:

Yes, exactly, Tuanphan.

Try adding to Design > Custom CSS

@media screen and (min-width:992px) {
[data-section-id="644983fb4c979540e055617c"] {
    min-height: unset !important;
    height: 150vh;
}
}

It looks fine to me

Hi,

Can you share link to index page? We can check easier

Add to Design > Custom CSS

 /* Force burger on desktop */
  .header-burger {
    display: flex !important
}

.header--menu-open .header-menu {
    opacity: 1 !important;
    visibility: visible !important
}

.header-nav {
    visibility: hidden !important
}
@media screen and (min-width: 768px) {
    .header-menu {
        width: 25%
    }
}

16 hours ago, Ernest said:

Thanks for the quick reply Tuanphan; strange that it looks normal on your emulated iPhone 12 pro. On my Google Pixel 6 pro and friends iPhone I still have the white space under the slide show.

 

This emulator shows the same:

 

Try adding to Design > Custom CSS

/* Mobile slideshow */
@media screen and (max-width:767px) {
.gallery-slideshow {
    height: 100vh !important;
}
}

17 hours ago, Mary_DG said:

https://www.hellocinnamon.com/start-of-a-journey

Thank you in advance. 

Try adding to Design > Custom CSS

/* Mobile Start of a journey page mobile */
@media screen and (max-width:767px) and (orientation:landscape) {
body#collection-62529309c36f381162dc8983 .gallery-slideshow {
    height: 150vh !important;
}
}

Add this to Design > Custom CSS

@media screen and (max-width:767px) {
.counter-value {
    font-size: 50px !important;
}

.counter-value:nth-child(3n+1) {
    clear: left;
}
}

Which template do you use? Brine or? I guess you should able to adjust this in Design > Site Styles

Hi,

What is site url? We can check easier

Your CSS box has a syntax error. Can you send all current code in CSS box?

What is site url? We can check easier

On 7/23/2023 at 9:24 AM, tuanphan said:

Add to Design > Custom CSS

@media screen and (max-width:1024px) {
.header-actions.header-actions--right, .header-actions.header-actions--right .header-actions-action {
    display: flex !important;
}

div.header-actions-action {
    position: relative;
    left: -100px !important;
}

a.btn.btn--border.theme-btn--primary-inverse.sqs-button-element--primary {
    display: block !important;
}
}

Change to this code

@media screen and (max-width:1024px) {
.header-actions.header-actions--right, .header-actions.header-actions--right .header-actions-action {
    display: flex !important;
}

div.header-actions-action {
    position: relative;
    left: -100px !important;
}

a.btn.btn--border.theme-btn--primary-inverse.sqs-button-element--primary {
    display: block !important;
}
a.btn {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
}
}

18 hours ago, SacredCrystal said:

 

Hello @tuanphan I used this code and managed to hide the CTY button, but i wish to also hide the ADD TO CART button, could you provide the code? Thanks

 

https://www.sacred-crystal.com

Use this CSS code

/* hide add to cart */
  div.sqs-add-to-cart-button-wrapper {
    display: none !important;
}