Jump to content

LoE

Member
  • Posts

    9
  • Joined

  • Last visited

Posts posted by LoE

  1. OMG I got the solution....

    I just use a gallery Block. Cut the picture so the right Aspec ratio and get an easy script for autoplay like this one:

     

    <script>
    (function() {
      var nextArrowGallery = document.querySelector('.gallery-reel-control-btn[data-test="gallery-reel-control-btn-next"]');
      
      function clickNextGallery() {
        nextArrowGallery.click();
      }
     
      setInterval(clickNextGallery, 3000);
    })();
    </script>


    so know I only have to change for every new image the aspec ratio. but is a lot less hussle to do it on every new image then expect the site to do it....
     
     
    Thank you so much for helping me out!!!!
  2. 1 minute ago, tuanphan said:

    I see no link, no button here. I see image + title only. Did you solve it?

    Unfortunately not. I tried, but I don't know if it's possible. I don't think it's possible because if you click on an image, you'll get the drag hand when you hover over the banner. Now I do have "Buttons" unter the Elements

    The idea was: I click on an image and I get to a new page, without any buttons, just a click on the image.

    I thought it would be possible to get something identical to a gallery block (like on https://www.martinmorscher.com/neu3).

     

     

     

     

    Bildschirm­foto 2023-04-25 um 15.57.09.png

  3. On 4/22/2023 at 3:04 AM, tuanphan said:

    Add to Settings > Advanced > Code Injection > Footer

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
    <script>
    
      $( ( ) => {
      
        /*
        
          auto click user items list arrow right
          
          Version       : 0.1d0
          
          SS Version    : 7.1
          
          Dependancies  : jQuery
          
          Note          : this effect is not active in SS Preview to test it use
                          private browsing < https://bit.ly/3f6lhq2 >.
          
          By            : Thomas Creedon < http://www.tomsWeb.consulting/ >
          
          */
          
        const clickIntervalSeconds = 1;
        
        const dataSectionIds = [
        
          /*
          
            to limit the effect to certain page sections, enter data section ids for
            each page section.
            
            the format of each line is a data section id
            
            following is an example line. copy the example line below and paste
            after the example line. remove '// ' at beginning of pasted line. repeat
            for as many data sections ids as needed
            
            */
            
          // '[enter data section id here between single quotes]',
          
          ];
          
        // do not change anything below, there be the borg here
        
        if ( window.frameElement !== null ) return; // bail if in Preview
        
        let selector = [
        
          '.user-items-list-banner-slideshow__arrow-button--right',
          
          '.user-items-list-carousel__arrow-button--right',
          
          ];
          
        // begin shotgun selector
        
          if ( ! dataSectionIds.length ) dataSectionIds.push ( '' );
          
          selector = $.map ( selector, function ( s, i ) {
          
            if ( ! dataSectionIds.length ) dataSectionIds.push ( '' );
            
            const a = $.map ( dataSectionIds, function ( d, i ) {
            
              if ( d ) d = '[data-section-id="' + d + '"] ';
              
              return d + s;
              
              } )
              
            return a;
            
            } )
            
            .join ( ', ' );
            
          // end shotgun selector
        
        const $button = $( selector );
        
        if ( ! $button.length ) return; // bail if no button
        
        const click = ( ) => {
        
          $button.click ( );
          
          }
          
        setInterval ( click, clickIntervalSeconds * 1000 );
        
        } );
        
      </script>
      
      /* As Seen in Logo carousel */
      <style>
      .user-items-list {
        padding: 0px !important;
    }
    .user-items-list-carousel__gutter {
        padding: 0 !important;
    }
    .desktop-arrows, .mobile-arrows {
        display: none;
    }
    </style>

     

     

    Thank you! Now the slideshow works!

    Now the only thing missing is that there is a link on top of the image. It should be the same link that the button at the bottom has. The buttons should also disappear. Can you also help me with this?

    Thanks for the help so far!

  4. On 4/15/2023 at 1:22 PM, tuanphan said:

    https://www.martinmorscher.com/neu2

    You can enable buttons, then we can give code to turn button link to image link (+code to hide buttons then)

    With moves to the right every few seconds, you need to enable list arrows first, then we can give code easier

    Hey tuanphan,

    thank you very much for helping out. I did turn on button link and linket my first element. what code do I need?

    is it also possible to hide the arrows? 

    thank you very much!

  5. I want to have a slideshow on my homepage that automatically moves to the right every few seconds. Additionally, when clicking on a picture, the user should be redirected to another page.

    I tried to create this using a gallery slideshow, but it didn't work. Unfortunately, I am not able to set the aspect ratio to 2/3.

    Here is my page with a carousel (it is missing the automatic movement to the right and the redirect when clicking on a picture): https://www.martinmorscher.com/neu2

    Here is my page with a gallery slideshow (it is missing the 2/3 aspect ratio and the appearance of neu2, as well as the automatic movement to the right): https://www.martinmorscher.com/neu3

    Could someone please help me? It doesn't matter if it's neu2 or neu3, just whatever is the easiest to implement.

    Thank you in advance.

×
×
  • 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.