lfs-carousel /

Filename Size Date modified Message
lfs_carousel
80 B
1.5 KB
102 B
1.9 KB
917 B
What is it?
===========

LFS Carousel is pluggable carousel/slider application for use with LFS (Lighting Fast Shop)

See project wiki for more details: https://bitbucket.org/pigletto/lfs-carousel/wiki/Home

Basic usage
===========

* add lfs_carousel to INSTALLED_APPS in your settings.py
* add lfs_carousel urls to your site urls.py like:

  from lfs_carousel import carousel
  urlpatterns += patterns("",
    (...)
    (r'^carousel/', include(carousel.urls)),
    (...)
)
  
* add carousel to management panel to 'Shop' -> settings page as new tab:
  copy lfs/templates/manage/shop/shop.html to your theme and modify it by adding:
  {% load lfs_carousel_tags %}
  ( ... )
  <div id="manage-tabs">
    <ul>
        <li class="ui-tabs-nav-item"><a href="#data">{% trans 'Shop' %}</a></li>
        <li class="ui-tabs-nav-item"><a href="#default-values">{% trans 'Default Values' %}</a></li>
        <li class="ui-tabs-nav-item"><a href="#portlets">{% trans 'Portlets' %}</a></li>
        **<li class="ui-tabs-nav-item"><a href="#carousel-items">{% trans 'Carousel' %}</a></li>**
    </ul>
  (...)
  <div id="portlets">
    {{ portlets|safe }}
  </div>
  **{% carousel_management shop %}**
  
* add carousel to your shop's start page
  By default lfs_carousel uses coin-slider but you can use anything you want. 
  First add necessary JavaScript and CSS files either to base.html or to shop.html:
  
  <link rel="stylesheet" href="{{ STATIC_URL }}coin-slider/coin-slider-styles.css" type="text/css" />
  <script type="text/javascript" src="{{ STATIC_URL }}coin-slider/coin-slider.min.js"></script>
  <script type="text/javascript">
        $(document).ready(function() {
            $('#coin-slider').coinslider({ width: 400, navigation: true, delay: 10000, hoverPause: true });
        });
  </script>
  
  Second: copy lfstheme/templates/lfs/shop/shop.html to your theme and add:
    {% load lfs_carousel_tags %}
    (...)
    {% carousel_show shop %}
  
* run syncdb (!)
Tip: Filter by directory path e.g. /media app.js to search for public/media/app.js.
Tip: Use camelCasing e.g. ProjME to search for ProjectModifiedEvent.java.
Tip: Filter by extension type e.g. /repo .js to search for all .js files in the /repo directory.
Tip: Separate your search with spaces e.g. /ssh pom.xml to search for src/ssh/pom.xml.
Tip: Use ↑ and ↓ arrow keys to navigate and return to view the file.
Tip: You can also navigate files with Ctrl+j (next) and Ctrl+k (previous) and view the file with Ctrl+o.
Tip: You can also navigate files with Alt+j (next) and Alt+k (previous) and view the file with Alt+o.