I've set the modules up

The problem was with the modules configuration e.g. they didn't work even without the responsive classes

Slideshow 1920px has these classes
aussie-slideshow wave-border hidden-phone

Slideshow 1366px
aussie-slideshow wave-border hidden-desktop hidden-tablets visible-phone

This is what is added now

I enabled the articles that were unpublished for one module and added readmore to each article

Cheers
Paul

    paulus1031
    Hi!
    Why did not the modules configuration work?
    Could I know where these classes added now you used are described? In this way the next time I will use them without asking for help.
    I did not understand why you added the "readmore". What purpose does it serve? when there was only one module the "readmore" was not there.
    The alternation of the modules works, but the breakpoint is wrong. I wish there was a breakpoint at 1366px.
    In addition, the title superimposed and the disks indicating which of the 3 slides is active, are both moved much higher, as you can see in attached screenshot. Why?
    The central logo that I had put is gone. There is no longer even in the images folder. It is also seen from the attached screenshot.
    Cheers

      Hi

      I adjusted the height of the backstretch as the image size is a little problematic dimension wise
      I'd forgotten the position of the text is linked to the slideshow backstretch height

      I've changed the backstretch height so you can see on the desktop module

      The readmore you don't have to use but I've found it reduces confusion as the introtext will only display content before the readmore line

      Regarding the navigation disks this is linked again to the backstretch value which I have changed back to 770 from the 540

      The breakpoint is more complicated

      Are you planning to change the template breakpoints?

      Cheers
      Paul

      Regarding the logo I can see it on the site

      Cheers
      Paul

      Hi!
      I added the logo later on. In fact, in the screenshot that I attached in the previous post, the logo was missing.
      Having two modules is useless, as they alternate only when the screen becomes very small, around 618px. However, now the photos can be seen entirely on all screens.
      How do you remove the white stripe that appears on the top edge under the logo (see screenshot)?
      Thanks!
      Cheers

      Try to add the following custom css code to remove marked white strip:

      #bannerwrap .moduletable {
	margin-top: 0;
}

      Cheers
      Joshua

        Hi

        Looking at the site I see module id 1185 displaying on desktop and tablet
        and module id 1000 displaying on phone

        They desktop module hides at the breakpoints set in the template settings at 619px

        As these modules both currently display images they will display images on all screens

        Cheers
        Paul

        Joshua-M

        Try to add the following custom css code to remove marked white strip:

        #bannerwrap .moduletable {
        margin-top: 0;
        }
        Cheers
        Joshua

        Hi! It works!
        Thanks!
        Cheers

          Hi!
          I tried to use these classes for module "Slideshow 1366px":

          aussie-slideshow wave-border hidden-desktop visible-tablets visible-phone

          ...and I tried to use these other classes for module "Slideshow 1920px":

          aussie-slideshow wave-border hidden-phone hidden-tablets visible-desktop

          My goal was to enlarge the breakpoint from phone (620px) to tablet (787px), which manages the alternation between the two modules, without changing the template setting.
          The result is that from 620px to 787px of width no slideshow is displayed.
          What did I do wrong?
          Thanks!
          Cheers

          Hi

          Can you not use

          aussie-slideshow wave-border hidden-phone on the desktop width

          and other

          aussie-slideshow wave-border hidden-tablets hidden desktop

          Cheers
          Paul

          Hi!
          1) Sorry, it's not clear to me. Could you tell me what classes I have to write in the "Slideshow 1366px" module and what classes should I write in the "Slideshow 1920px" module?

          I would like the "Slideshow 1366px" module to be displayed on phone and tablet, while the "Slideshow 1920px" module only on desktop.
          Thanks!

          2) As you can see in attached screenshot, the photo of the slideshow comes out from below creating a strip. How to solve? I used this rule, but it is overwritten.:

          html.itemid-101 .backstretch{ height: 740px !important;}

          Thanks!
          Cheers

          Hi,

          1) For you Slideshow 1366px try to use only this class:

          aussie-slideshow wave-border hidden-desktop

          2) Please try to remove your browser's cache, because I can't see this issue (seems that your code works).

          Cheers
          Joshua

          Hi!
          Now everything works! I only regret that we can not use as breakpoints greater width of 787px, such 1200px.
          Thanks to both for the help, Paulus1031 and Joshua-M!
          Cheers

          Thanks for the update

          You can change the breakpoints in the template settings

          There are classes to use to target these I think from memory

          Hide classes
          hidden-desktop
          hidden-tablets
          hidden-tablet
          hidden-phones
          hidden-phone
          min-width-desktop
          min-width-tablet
          min-width-phones
          hidden-navcollapse
          hidden-gridcollapse

          Visible classes
          visible-desktop
          visible-tablets
          visible-tablet
          visible-phones
          visible-phone
          visible-navcollapse
          visible-gridcollapse

          You need to Login to view replies.