Giter Site home page Giter Site logo

spree_slider's Introduction

SpreeSlider

Add a slider to the homepage of your Spree site, and manage the slideshow from within the Admin panel.

Installation

  1. Add this extension to your Gemfile with this line:

Spree >= 3.1

gem 'spree_slider', github: 'spree-contrib/spree_slider'

Spree 3.0 and Spree 2.x

gem 'spree_slider', github: 'spree-contrib/spree_slider', branch: 'X-X-stable'

The branch option is important: it must match the version of Spree you're using. For example, use 3-0-stable if you're using Spree 3-0-stable or any 3.0.x version.

  1. Install the gem using Bundler:
bundle install
  1. Copy & run migrations
bundle exec rake railties:install:migrations
bundle exec rake db:migrate
  1. Restart your server

If your server was running, restart it so that it can find the assets properly.

Using the slider

Spree 3 uses the bootstrap framework and a default slider template is available for bootstrap 3 spree/shared/_slider.html.erb.

Example usage:

  <%= render partial: 'spree/shared/slider', locals: { slider: Spree::Slide.published, cid: 'home', interval: false } %>

If you desire to have a customized carousel template you can specify your own like so:

<% if Spree::Slide.published.count > 0 %>
  <section id="slideshow">
    <ul class="slide">
      <% Spree::Slide.published.order('position ASC').each do |s| %>
        <li>
          <h1><%= s.slide_name %></h1>
          <%= link_to image_tag(s.slide_image.url), url_for(s.link_url) %>
        </li>
      <% end %>
    </ul>
    <a title="<%= t(:previous) %>" class="slider-prev"><%= t(:previous)%></a>
    <a title="<%= t(:next) %>" class="slider-next"><%= t(:next) %></a>
  </section>
<% end %>

Dynamic content management

To add dynamic content, go to the spree admin section, under 'Configuration' and find the Spree Slider & Spree Slider Locations menu.

You can create new slides and new locations. Then to fetch & render the slider for a particular location you can do the following:

  <% slides = Spree::Slide.published.location("home") %>
  <%= render partial: 'spree/shared/slider', locals: { slider: slides } %>

Copyright (c) 2012 R.S.A. released under the New BSD License

spree_slider's People

Contributors

bbonislawski avatar berkes avatar daemonsy avatar damianlegawiec avatar factor4 avatar garpit avatar gudata avatar iloveitaly avatar jdutil avatar johanb avatar joshuapaling avatar jspizziri avatar jsqu99 avatar kao avatar mafi88 avatar mauazua avatar mjc avatar poudelprakash avatar priviterag avatar rupix avatar sfcgeorge avatar shradhan avatar stevenbarragan avatar zewelor avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

spree_slider's Issues

Remove support for options other than 'roll your own'?

This repo was moved to spree-contrib based on priviterag/spree_slider#12

Early in that thread, @JDutil mentions he thinks this extension should only support rolling your own slider. I'd agree. There's potentially infinite ways to roll your own, and it's relatively easy. The integration of a means to add / edit slides with the Spree admin area is the harder / unique feature that this plugin offers.

If we're agreed it's a good approach to remove support for other sliders, I'm happy to do that and submit a PR. Thoughts?

AWS S3 File Storage Configuration

When using on a Heroku deployed setup with AWS for file storage, is there a way to configure the slider to use the same settings as my spree store and upload the slide images to AWS S3 bucket.

If there is a way please document.

Not products has been loaded into Slides form

On Spree 4.2 it's correct hidden_field_tag in slides form to get products?

<%= f.field_container :product_id do %> <%= label_tag :product_id, t(:product) %>
<%= hidden_field_tag 'slide[product_id]', f.object.product_id.to_s, class: "product_picker fullwidth" %> <% end %>

Change image size

How i change image width in the slide? I need that image fills the entire slider, not the slider fills the entire image.
Thanks
Sorry for my English.

solidus_slider error

Hi,

When i am using gem 'solidus_slider', github: 'spree-contrib/solidus_slider' than perform bundle install.
i am getting error.

Git error: command `git clone 'git://github.com/spree-contrib/solidus_slider.git'

Thanks.

Slider inserts at the wrong position

i've installed Spree_slider succesfully and everything works fine according to the functionality,
But the problem it is getting inserted between the header and navbar
but i want to insert it after the nav bar
Can you guys suggest me how to proceed
image
something like this

Installing spree_slider

Hello everyone,
Well, when I try to run the bundle install appears some error messages about spree version:

"Could not find gem 'spree_backend (~> 3.2.0.alpha)' in any of the gem sources listed in your Gemfile or available on this machine."

Of course that i'm not using 3.2.0.alpha version (i'm using 3.1.0.rc3), but i want to run spree_slider with spree 3.1.0.rc3. How do i do that?

Regards

undefined local variable or method `slider'

With a relatively fresh Spree 3.0 and slider install I get this error on the homepage.

undefined local variable or method `slider'

It's coming from the _slider partial because in the default Deface override the local variable slider isn't passed in as the Readme suggests.

Overriding the override fixed it, but it would be better if it works out of the box.

Either the partial should check for the slider variable, or the override should pass it in.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.