sanchez_77

On 10/18/2023 at 5:27 PM, Web_Solutions said:

 

Add these code for remove the links from image in a summary block.

.summary-item .summary-thumbnail-outer-container{
  pointer-events: none !important;
}

 

thanks, much appreciated.

On 9/3/2020 at 10:04 AM, tuanphan said:

Add to Home > Design > Custom CSS

/* disable image post click */
article.blog-basic-grid--container>div:first-child {
    pointer-events: none;
}

 

hi @tuanphan this is great, but on my page I have two blogs, one is the main feed and another is via a summary block. Is there a way to remove the links from image in a summary block?

Merci

On 6/3/2023 at 11:46 PM, tuanphan said:

Can you share link to page where you use testimonials?

I have a site wide PW but with this it opens up everything. Is there another way for me to share it not in a public forum?

On 5/28/2023 at 8:45 AM, tuanphan said:

Hi,

This is possible. Just add an Image Block with Classic Editor Section (do not use new editor, because new editor doesn't support image url) (the image support click though url)

Then share link to page where you added Image Block, we can give code to make hover/scale effect

Hi, apologies for the delayed response, I didn't realise I had to follow threads to get alerts.

I've now managed to convince my client to avoid this type of functionality as it wasn't worth the time investment. I've never switched to the classic editor, and didn't know you could do that so thanks for the tip.

I've tried a few of the scripts mentioned in this thread but can't get any of them to work... The sensitive nature of my site contents prevents me sharing links on a public forum which makes debugging near impossible.

I wanted to automatically scroll one testimonial section but after not managing to get this working I decided to try it globally and then edit it from there. Globally it fails too... I'm a bit stuck!

So i'm fully onboard with 7.1 and I can see many of the advantages but i'm also experiencing some of the limitations.

My client has asked me to add more movement/animation to the site, i've enabled the super easy site wide 'fade' option and whilst this helps, I know what they really want is images sliding in from the side as was possible in version 7.0.

I've clicked on the design area of the image blocks and the 'animation' option has now been removed, is there any way around this? I don't want things zipping all around the screen but a few key images sliding on would be most excellent.

Pulling my hair out here (well I would if there was any left)...

Back in the day I used to build media rich buttons with an up and over state which also included a click-though link. I'm damned if I can find a way to do this in Squarespace 7.1.

I've seen a few tutorials, but they simply replace the background with an image, or on hover, and quite often they don't include a way to add a click-though link, or the background image scales disproportionately.

In short i'm looking to do the following:

• add an image block
• scale align and place
• add click-through link
• via css, add a hoverstate image that retains the scale and alignment variables with associated click-though

I guess i'm probably old skool but this would allow me to add a bit of movement to the site which has been requested by the client.

Is there a reason this has been made difficult to implement? Is it non-mobile friendly?

ok, i've tried loads of variations, it would seems as if there's a blind-spot in the plug-in code, whereby it ignores the CSS suggested in the instructions, for the default page styles when linking to a form element from the header CAT button. The solution I found was targeting the styles directly as per below:

It's a great plug-in but I can't get the custom CSS to work for styling the font in the light box. I add the following code to 'design/Custom CSS' and it does nothing... weird.

#lightbox_contact-form_#block-yui_3_17_2_1_1675077402973_2763

/* Plugin Lightbox - Custom Styles */
html .c-lightbox__content-inner {
  font-family: montseratt;
  font-weight: bold;
  color: #004f59;
}
/* end Plugin Lightbox - Custom Styles */

I can see it when I use the inspect tool in Firefox but it's not taking effect. It seems to be overwritten by the section styles. I can't edit them as it will impact other sections

I've followed the set-up guide and instructions. But the font colour doesn't change to match my custom CSS:

It does on the page, but it's not reflected in the lightbox... it's like the site styles are overriding it. I don't want to change the base site sties as that will impact quite a lot.

/* Plugin Lightbox - Custom Styles */
html .c-lightbox__content-inner {
  font-family: Montserrat Bold !important;
  color: #004f59 !important;
}
/* end Plugin Lightbox - Custom Styles */

[data-section-id="63987c0852c95e1ff8f2cff1"] .content-wrapper {
    padding-top: 2vmax !important;
    padding-bottom: 2vmax !important;
}

I have a site, with a section block set to the following:

- Fill screen
- Height = L
- Alignment = centered

On my iPad, Macbook, Surface and iMac it works perfectly but on the client's machines running the following resolutions, content in the section is cut-off at the bottom:

1366x768
1920x1080

Clearly these screens aren't the best spec but they are large company issue so there's very little I can do about them. Using inspector in FireFox, it looks like the padding on the section when set to 'L' is 10vmax, however changing it to either 2, or 3 would probably make enough of a difference to see all the content on the screen. I know I should be able to do this via CSS but I can't get it working. I know by changing the height to either 'S', or 'M' reduces the padding however my video content then doesn't fill the screen on larger monitors.

Below is the code I have:

<div id="yui_3_17_2_1_1674730387775_310"

.page-section.vertical-alignment--middle:not(.content-collection):not(.gallery-section):not(.user-items-list-section):not(.editmode-changing-rowcount).section-height--large > .content-wrapper {
  padding-top: 3vmax;
  padding-bottom: 3vmax;

1 hour ago, Ziggy said:

There's no need for code, watch this video, the end where you can see the resizing has a black background hiding my desktop, but the area you can see is the browser which is being resized to demonstrate it covering the viewport completely.

https://www.loom.com/share/5215002324ab418ca83f6c58c401e6dd

literally awesome. I think I was missing the 'L' option and centering setting. I'll refer back to this movie in the next day or two once my header movie is complete.

Really appreciate your perseverance.

59 minutes ago, Ziggy said:

Can you share where this is happening, because I have never seen a background video not fill the height and width, that's what backgrounds do.

You haven't done this and added black bars have you?

 

Happy to share a link but it's not content for a public domain (just yet) which makes things a bit more complicated...

>You haven't done this and added black bars have you?

No, it was just a thought and I appreciate this is unlikely to work, especially as the video will be hosted externally on Vimeo or YT. This means the video will be 1920x1080 and will need some code to stretch it both vertically and horizontally to fill the browser as necessary

37 minutes ago, Ziggy said:

Are you using a background video? Or a video block? A background video fills the space by default, and doesn't affect the placement of any blocks within the section.

i'm using a background video/image so assumed it would fill the width and height but it only fills the width.

Block>Edit section>Background>Video

With background with = full bleed

4 minutes ago, Ziggy said:

Unless I'm missing something, this sounds like you want a standard background section with a background video, section set to Large (100vh) with a text block and a button block. 

essentially yes. Is it possible to target just the background video element and set it to fill the browser height and width, leaving the text and button blocks intact?

Apologies if i'm being dumb but when I use the default built in settings (7.1) the temporary image fills the width, but never scales the height correctly!

9 minutes ago, Ziggy said:

Would running this as a background video work? There are plugins that add video controls to the background video.

It needs to automatically play on loop in the background with no controls. If it wasn't complex I would consider an animated GIF.

So it needs to have the following on screen when a user opens the page:

1. site header (navigation + logo)
2. video background filling full width + height (regardless of browser size) with a text and button block over the top

Hi,

My client has asked me to create a video that automatically plays in the header of the index page at full browser height. I don't event know if this is possible? I know you can stretch them to full width but the height is determined by the proportion (16:9) of the source video and not your browser...

I'm about to create the movie which will take a couple of days and i'm not sure if I should make something really deep (1920x4000) to cheat it, and if this is even workable.

their wish is to have a movie (with back-up image) that fills the entire browser window regardless of size, the content over the top then appears as normal, before scrolling down to the rest of the page content below the fold. I've seen this on other sites but not on Squarespace.

I've tried getting this to work with a normal image and that's 'quirky' as it never scales quite right to fill the screen, even selecting 'full bleed' in the background image settings.

TIA

what a great addition. Is there a way to change the font? I've set the fonts for the site in styles, and checked they are also applied in the buttons window but still a random default font from the template is being picked up.

I need to build the attached, and i'm not entirely sure of the best way to approach it. Essentially I need two menus, one that includes the following:

• Social icons
• Client review link
• request demo btn (email form)

And a secondary hamburger menu that includes the rest of the site navigation.

I guess what complicates this somewhat, is how this ends up being handled on a mobile? Really what needs to happen is the secondary hamburger menu on the desktop is binned on mobiles, and everything appears within a single default hamburger menu – if that makes sense?

I appreciate from a UX POV this is sub optimal, but i've inherited the design and need to do my best to achieve this.