tuanphan

On 6/5/2022 at 7:46 AM, liammccullough said:

Hi! 

I'm having this same issue, curious if any solutions are out there

I used Squarespace design built in tools to add the corner radius on this image, but im loosing the rounded corners while hovering over the image in Safari, most likely due to the Zoom in effects I added in the CSS. 

Here is the Zoom in code that I think is causing the corners to disappear on line 383 of my CSS. 

/// POSTER BLOCK IMAGE HOVER ZOOM ///
section[data-section-id="624219730c03d07a5c1c6030"]
.image-block img {
  transform:scale(1.1);
  transition: all 1.3s;
  z-index:1}
section[data-section-id="624219730c03d07a5c1c6030"]
 .sqs-block-image:hover img {transform:scale(1.3);
  transition: 18s;
}

 

Website is liammccullough.ca
password is: Cozmox

Have you found a solution yet?

Hi. Why don't you use Accordion Block??

Your site is private. Can you setup password & share url again? We can check easier

Sorry for delay. Just had a long trip.

I see mobile has a different structure. Can you remove above code? We will give a new code

Hi.

What is your site url? We can help easier

It looks like you replaced it with image. Do you still need help?

Use this CSS (Design > Custom CSS)

#announcement-bar-text-inner-id p {
    font-size: 16px !important;
    text-align: left !important;
}

On 6/4/2022 at 6:56 PM, HunterD said:

My video also is getting zoomed!! Can you help me? @tuanphan

What is page url?

Hi. Can you take a screenshot of problem?

Hi. Did you solve it? It looks fine to me

Hi,

Same size guide for all products or different size guides? And which position to place size guide button?

Use this CSS

.cart-subtotal-label span {
    font-family: 'halyard-text' !important;
}

On 6/4/2022 at 7:07 AM, VPerfeito said:

@tuanphan

Can this be done to with a video file? 

https://www.portanova.pt/

Thank you

Use this CSS

@media screen and (max-width:767px) {
[data-section-id="6251f2d8a7b6271ae9b6d286"] video {
    width: 100% !important;
    height: auto !important;
    left: 0 !important;
}
[data-section-id="6251f2d8a7b6271ae9b6d286"] {
    min-height: unset !important;
    height: 25vh;
}
}

On 6/4/2022 at 6:24 AM, ROX said:

Hello,
I'm trying to create a menu that displays an image by hovering over text. 
First, How can I fit the background image to the width of the section?
Second, right now when I go over a text it brings the image on top of the page and moves everything down. so the section's height is dynamic. I want the text to be fixed and also the position of the images fixed so that by hovering over the text it only changes the background image.
I appreciate if you could help me with this question.

Hi. Have you tried Portfolio Page Yet? It has a layout to achieve this

On 6/4/2022 at 5:14 AM, likemindedproductions said:

 

Thanks but is there any way of just moving the footer nav?
I planned on using the footer bottom blocks

Remove above code & use this code

@media screen and (min-width:641px) {
nav.Footer-nav {
    position: absolute;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 99999;
}
.Footer-inner.clear {
    position: relative;
}
}

On 6/4/2022 at 4:28 AM, laurensmithart said:

Hi-

 

 I have a code from lodgify- it displays beautifully but doest connect. Any suggestions? The site is thesandpointresort.com... and here is the code I embedded using a code block, its on the homepage and the booking page:

 

<script type="text/javascript" class="" src="https://cdn.lodgify.com/portable-search-bar/1.60.6/renderPortableSearchBar.js"></script><div><div id="lodgify-search-bar" data-website-id="368676" data-language-code="en" data-dates-check-in-label="Arrival" data-dates-check-out-label="Departure" data-guests-counter-label="Guest" data-guests-input-singular-label="{{NumberOfGuests}} guest" data-guests-input-plural-label="{{NumberOfGuests}} guests" data-location-input-label="Location" data-search-button-label="Search" data-new-tab="true">
  </div>
   <style type="text/css">
  html {
    --lodgify-ui-action-color: #fac600;
    --lodgify-ui-action-darker-color: #c89e00;
    --lodgify-ui-action-lighter-color: #fde899;
    --lodgify-ui-action-contrast-color: #000000;
  }
  </style>
    </div>

Can you check site url? It says

Domain Not Claimed

On 6/4/2022 at 4:09 AM, PeterBe said:

Site URL: https://www.khin.be/curry-bar

I am trying to get the Mobile version of this page working. I have tried some of the custom CSS tips on the forum but have not succeeded in getting it right.

Your help is much appreciated!

Peter

Which section are you referring to?

On 6/4/2022 at 4:05 AM, SarahO said:

Thanks @tuanphan! It would be preferable for the map block to be on the same page as the events because we wanted a quick "at-a-glance" type thing for people to see events in their area. Plus, that's also where people are registering for each event. I was hoping there was some way to code it into the existing event page. I will try it with a new page and see what my client thinks.

Would you be able to help me with code to adjust font color/size of the event title/date/time in the summary block? https://www.firstblessing.org/new-page-1

Add to Page Header

<style>
  /* title */
  a.summary-title-link {
    font-size: 30px;
    color: Red !important;
}
  /* Date */
  time.summary-metadata-item.summary-metadata-item--date {
    color: green !important;
    font-size: 30px !important;
}
  /* time */
  span.event-time-12hr {
    font-size: 40px;
    color: violet;
}
</style>

On 6/4/2022 at 3:29 AM, ShuiFeng said:

Aaaha!, it works beautifully for the Product Blocks! Thank you! Except I'm left with a text based checkout link on the Product Page at the top of the item description. Is there a way to hide it or remove it? Thanks

EDIT: This is located on the Product Page for "What The Feng Do I Do With All This Shui?"   https://shuifeng.squarespace.com/shop/p/what-the-feng

It looks like you solved this?

On 6/4/2022 at 2:04 AM, BennyCorrigan said:

Thank you so much for your reply. This is working now, but on desktop when the screen is reduced in width there is very little space between the images and titles, is there code to increase this padding? Also the 1st and third people descriptions appear indented compared to the second one?

Any help is great appreciated,

 

Hi. Can you take a screenshot of problem?

On 6/4/2022 at 1:41 AM, Shakeyra said:

I'm having the same issue. I'm using a image carousel list and would like all the images to be clickable but cant figure out how to do it. Can you help?

If you share link to page where you added carousel, we can tweak the code easier

Hi. Your site is private. Can you setup password & share url again? We can check easier

If you remove the image, the page code structure will change so will need a new code

ah, edit this code

   font-family: orpheus-pro;
    font-size: 3em;
    color: #F9F8ED;

to this

   font-family: orpheus-pro !important;
    font-size: 3em !important;
    color: #F9F8ED !important;

On 6/3/2022 at 10:08 PM, NICOLELEIGH9 said:

https://cricket-poodle-pdnh.squarespace.com

Try adding to Design > Custom CSS. Replace with new image url

div.header-nav-item--active>a:after {
    content: "";
    background-image: url(https://cdn.pixabay.com/photo/2022/03/08/07/08/water-7055153__480.jpg);
    background-size: cover;
    width: 100%;
    height: 5px;
    display: block;
}