Announcement

Collapse
No announcement yet.

Colossus Hero Roundabout

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

    #16
    Hi Scott,

    Those lines are part of the documentation [ https://docs.miva.com/readytheme-sha...ml#hero-slider ].
    Matt Zimmermann

    Miva Web Developer
    Alchemy Web Development
    https://www.alchemywebdev.com
    Site Development - Maintenance - Consultation

    Miva Certified Developer
    Miva Professional Developer

    https://www.dev4web.net | Twitter

    Comment


      #17
      They appear to be wrong, or should NOT be there?

      Following this thread, I got the impression that these instructions were going to be removed because they are obsolete. That hasn't been done yet?
      Need to offer Shipping Insurance?
      Interactive Design Solutions https://www.myids.net
      MivaMerchant Business Partner | Certified MivaMerchant Web Developer
      Competitive Rates, Custom Modules and Integrations, Store Integration
      AutoBaskets|Advanced Waitlist Integration|Ask about Shipping Insurance Integration
      My T-shirt Collection is mostly MivaCon T-shirts!!

      Comment


        #18
        At the moment, it would all depend on which ReadyTheme you were using. That being said, this will all change with the release of the next version of Shadows as the build process is different and, at least at first, it will not be shipping with Roundabout.
        Matt Zimmermann

        Miva Web Developer
        Alchemy Web Development
        https://www.alchemywebdev.com
        Site Development - Maintenance - Consultation

        Miva Certified Developer
        Miva Professional Developer

        https://www.dev4web.net | Twitter

        Comment


          #19
          I am using Colossus, which as far as I can tell pointed to the Shadows documentation for this. Once I realized where the link was I just clicked. I could not find "extensions" in CSS Resources and finally went to the forum -- this thread.

          Scott
          Need to offer Shipping Insurance?
          Interactive Design Solutions https://www.myids.net
          MivaMerchant Business Partner | Certified MivaMerchant Web Developer
          Competitive Rates, Custom Modules and Integrations, Store Integration
          AutoBaskets|Advanced Waitlist Integration|Ask about Shipping Insurance Integration
          My T-shirt Collection is mostly MivaCon T-shirts!!

          Comment


            #20
            Current and next. Right now, there is no build process for the ReadyThemes.
            Matt Zimmermann

            Miva Web Developer
            Alchemy Web Development
            https://www.alchemywebdev.com
            Site Development - Maintenance - Consultation

            Miva Certified Developer
            Miva Professional Developer

            https://www.dev4web.net | Twitter

            Comment


              #21
              Hey Matt,

              Where is the best source of feature info about configuring roundabout? Now that I have it working, I need to know if I can actually use it. Autostart and delay aren't enough and I am guessing there are other nice features?

              Thanks.

              Scott


              Need to offer Shipping Insurance?
              Interactive Design Solutions https://www.myids.net
              MivaMerchant Business Partner | Certified MivaMerchant Web Developer
              Competitive Rates, Custom Modules and Integrations, Store Integration
              AutoBaskets|Advanced Waitlist Integration|Ask about Shipping Insurance Integration
              My T-shirt Collection is mostly MivaCon T-shirts!!

              Comment


                #22
                lesliekirk - That's the plan.

                ids - Unfortunately, there really aren't any features included with Roundabout. It was intended to be very simple. If a developer is looking for more options, I usually recommend using Slick, which ships in Colossus. As for the Roundabout options, these are the ones available.
                Code:
                You can pass the following settings to change the elements being called by the function:
                
                autoStart: false \\ [Boolean] - Set to `true` for automatic cycling
                carouselDelay: 5000 \\ [Integer] - Set delay between slide display for automatic cycling
                group: false \\ [Boolean] - Set to `true` to create grouping of elements based on breakpoint
                groupClass: 'x-carousel__item' \\ [String} - Set the class to be used for element groups
                groupTiny: 2 \\ [Integer] - Set number of elements to show on screens < 640px
                groupSmall: 2 \\ [Integer] - Set number of elements to show on screens between 640px and 767px
                groupMedium: 4 \\ [Integer] - Set number of elements to show on screens between 768px and 959px
                groupLarge: 4 \\ [Integer] - Set number of elements to show on screens between 960px and 1439px
                groupWide: 4 \\ [Integer] - Set number of elements to show on screens >= 1440px
                groupWrapper: 'figure' \\ [String} - Set element to wrap groups with
                
                $.hook('carousel').roundabout({
                    autoStart: false,
                    carouselDelay: 5000,
                    group: false,
                    groupClass: 'x-carousel__item',
                    groupTiny: 2,
                    groupSmall: 2,
                    groupMedium: 4,
                    groupLarge: 4,
                    groupWide: 4,
                    groupWrapper: 'figure'
                });
                Matt Zimmermann

                Miva Web Developer
                Alchemy Web Development
                https://www.alchemywebdev.com
                Site Development - Maintenance - Consultation

                Miva Certified Developer
                Miva Professional Developer

                https://www.dev4web.net | Twitter

                Comment


                  #23
                  Ok, thanks. I wish I would have known before. This is a non-starter. It doesn't look like there is any fade type of capabilities for example.

                  So, Slick...any instructions for integrating with the RT like there is with roundabout? I imagine the template containing the images is similar?

                  Scott
                  Need to offer Shipping Insurance?
                  Interactive Design Solutions https://www.myids.net
                  MivaMerchant Business Partner | Certified MivaMerchant Web Developer
                  Competitive Rates, Custom Modules and Integrations, Store Integration
                  AutoBaskets|Advanced Waitlist Integration|Ask about Shipping Insurance Integration
                  My T-shirt Collection is mostly MivaCon T-shirts!!

                  Comment


                    #24
                    No instructions for making a hero slider in the current line of ReadyThemes. You should be able to use a reference from Levels for the basic layout/function and then make modifications as needed.

                    https://www.miva.com/forums/forum/de...age-slide-show

                    https://www.miva.com/forums/forum/de...-into-a-slider
                    Matt Zimmermann

                    Miva Web Developer
                    Alchemy Web Development
                    https://www.alchemywebdev.com
                    Site Development - Maintenance - Consultation

                    Miva Certified Developer
                    Miva Professional Developer

                    https://www.dev4web.net | Twitter

                    Comment


                      #25
                      Thanks Matt.

                      Next important question. Slick is already running on the storefront -- featured products is default.

                      When adding a hero slider do I add a separate block of code for the hero-slider?

                      Code:
                              
                      $.loadScript(theme_path + 'plugins/slick/slick.min.js', function () {
                      $.hook('featured-products').slick({
                      ...
                      });
                      $.hook('hero-slider').slick({
                      ...
                      });
                      Need to offer Shipping Insurance?
                      Interactive Design Solutions https://www.myids.net
                      MivaMerchant Business Partner | Certified MivaMerchant Web Developer
                      Competitive Rates, Custom Modules and Integrations, Store Integration
                      AutoBaskets|Advanced Waitlist Integration|Ask about Shipping Insurance Integration
                      My T-shirt Collection is mostly MivaCon T-shirts!!

                      Comment


                        #26
                        That's correct Scott.
                        Matt Zimmermann

                        Miva Web Developer
                        Alchemy Web Development
                        https://www.alchemywebdev.com
                        Site Development - Maintenance - Consultation

                        Miva Certified Developer
                        Miva Professional Developer

                        https://www.dev4web.net | Twitter

                        Comment


                          #27
                          Thanks.

                          What is wrong when the images stack instead of "slide" if you will?

                          Scott
                          IDS
                          Need to offer Shipping Insurance?
                          Interactive Design Solutions https://www.myids.net
                          MivaMerchant Business Partner | Certified MivaMerchant Web Developer
                          Competitive Rates, Custom Modules and Integrations, Store Integration
                          AutoBaskets|Advanced Waitlist Integration|Ask about Shipping Insurance Integration
                          My T-shirt Collection is mostly MivaCon T-shirts!!

                          Comment


                            #28
                            That sounds like it might be a styling issue, assuming there aren't any JavaScript errors being reported.
                            Matt Zimmermann

                            Miva Web Developer
                            Alchemy Web Development
                            https://www.alchemywebdev.com
                            Site Development - Maintenance - Consultation

                            Miva Certified Developer
                            Miva Professional Developer

                            https://www.dev4web.net | Twitter

                            Comment


                              #29
                              no js errors. Same with and without the div wrapper.

                              This is the RT content template. I am guessing I am missing some code in the template?

                              HTML Code:
                              <div id="js-hero-slider" class="hero-slider">
                                 <div data-hook="hero-slider">
                                  <div><mvt:item name="readytheme" param="image( 'hero_image_01' )"/></div>
                                  <div><mvt:item name="readytheme" param="image( 'hero_image_02' )"/></div>
                                  <div><mvt:item name="readytheme" param="image( 'hero_image_03' )"/></div>
                                  <div><mvt:item name="readytheme" param="image( 'hero_image_04' )"/></div>
                               </div>
                              </div>
                              <!-- end hero-slider -->
                              The data-hook attr fixed the stacking. I guess it needs the column?
                              Last edited by ids; 03-06-20, 03:28 PM.
                              Need to offer Shipping Insurance?
                              Interactive Design Solutions https://www.myids.net
                              MivaMerchant Business Partner | Certified MivaMerchant Web Developer
                              Competitive Rates, Custom Modules and Integrations, Store Integration
                              AutoBaskets|Advanced Waitlist Integration|Ask about Shipping Insurance Integration
                              My T-shirt Collection is mostly MivaCon T-shirts!!

                              Comment


                                #30
                                Try changing your code to:
                                Code:
                                <div class="hero-slider" data-hook="hero-slider">
                                    <div><mvt:item name="readytheme" param="image( 'hero_image_01' )"/></div>
                                    <div><mvt:item name="readytheme" param="image( 'hero_image_02' )"/></div>
                                    <div><mvt:item name="readytheme" param="image( 'hero_image_03' )"/></div>
                                    <div><mvt:item name="readytheme" param="image( 'hero_image_04' )"/></div>
                                </div>
                                <!-- end hero-slider -->
                                Matt Zimmermann

                                Miva Web Developer
                                Alchemy Web Development
                                https://www.alchemywebdev.com
                                Site Development - Maintenance - Consultation

                                Miva Certified Developer
                                Miva Professional Developer

                                https://www.dev4web.net | Twitter

                                Comment

                                Working...
                                X