Webid 1.0.6 Bootsrap HTML 5 Responsive barebone theme 2015-04-28

Webid 1.0.6 Bootsrap HTML 5 Responsive barebone theme

  1. kaerte
    WeBid Version:
    • 1.0.4/1.0.5/1.0.6


    [​IMG]

    [HR][/HR]

    webid-front.jpg View attachment 1788 webid-front-bootswatch-cyborg.jpg

    bootswatch screenshots​

    [HR][/HR]

    Demo Youtube Movie

    [video=youtube;fTo8HvQ0GFI]


    [HR][/HR]

    About this theme
    Theme uses Twitter Bootstrap:
    You can find more information about bootstrap on bootstrap main page: http://twitter.github.com/bootstrap/

    This theme is responsive and will work well on mobiles, laptops and desktop computers.

    You can change layout and look very quickly by using ready made free bootstrap themes from bootswatch http://bootswatch.com or use bootstrap theme generator (for an example http://www.boottheme.com/) to create your own theme.
    All you need to do is copy and paste generated css code into css/bootstrap.css replacing it's contents.


    [HR][/HR]
    Changes to Webid core files and additional features included in theme

    Before you start...

    Core files of Webid (php files in Webid main directory) included in package have been modded slightly in order for this theme to work properly. Always make a backup of your files before you start.

    This theme does not include any mods, and if you installed custom mods there is a big chance they will be removed by overwriting core files. You will have to install all mods again and change mod's tpl (if required) code accordingly to bootstrap specification (see bootstrap page for details)


    Theme zip package includes changed core files of Webid 1.0.6, template files and some new images (default, buy now, buy now only).

    New line to language file has been added at line 1575 in messages.inc.php
    Code:
    $MSG['31_1'] = "Show Subcategories";
    messages.inc.php is included with download but you can just add this line manually at the end of messages.inc.php. This text appears only on mobiles and allows to expand list of subcategories (just to save space and avoid scrolling down every time user is browsing)

    home page - home.tpl includes two lists of latest auctions and next ending at the very bottom. I added that tables for demonstration and you may wish delete them (or replace with mod) to avoid duplicated content.

    To remove bottom lists delete lines between 67 and 98 in home.tpl

    Code:
      <!-- IF B_AUC_LAST -->
      <hr  />
      <div class="row">
        <div class="span3">
          <h3>{L_278}</h3>
          <table class="table table-condensed">
            <!-- BEGIN auc_last -->
            <tr>
              <td style="text-align:center; width:50px;"><a href="{SITEURL}item.php?id={auc_last.ID}"> <img class="img-polaroid" src="{auc_last.IMAGE}" alt="{auc_last.TITLE}" style="height:40px; width:40px"/></a></td>
              <td><a href="{SITEURL}item.php?id={auc_last.ID}">{auc_last.TITLE}</a><br />
                <span class="muted"><small>{auc_last.DATE}</small></span></td>
            </tr>
            <!-- END auc_last -->
            </tbody>
          </table>
        </div>
        <!-- ENDIF -->
        <!-- IF B_AUC_ENDSOON -->
        <div class="span3">
          <h3>{L_280}</h3>
          <table class="table table-condensed">
            <!-- BEGIN end_soon -->
            <tr>
              <td style="text-align:center; width:50px;"><a href="{SITEURL}item.php?id={end_soon.ID}"> <img class="img-polaroid" src="{end_soon.IMAGE}" alt="{end_soon.TITLE}" style="height:40px; width:40px"/></a></td>
              <td><a href="{SITEURL}item.php?id={end_soon.ID}">{end_soon.TITLE}</a><br />
                <span class="muted"><small>{end_soon.DATE}</small></span></td>
            </tr>
            <!-- END end_soon -->
          </table>
        </div>
        <!-- ENDIF -->
    </div>

    Modifications

    - category list always visible when browsing auctions
    - added "all" to list all auctions
    - added current category when browsing categories
    - message boards are moved to help box
    - added logged-in user panel in "my account" which is always visible
    - added category drop down in main navigation
    - redirection after login was removed and goes to home page instead to last viewed page
    - on mobile devices long titles and subtitles are truncated and some less important table columns are hidden (to save precious space and for readibility)
    - removed thumbnail selection to save thumbnail in gallery (now all thumbnails are squashed down by default)
    - date picker (calendar) has been replaced with jquery ui calendar
    - changed help popup look
    - added register button to login form
    - removed search category drop down next to search field
    - changed category selection boxes when selling an item (default didn't work on mobile devices so now you have dropdowns)
    - added some icons to buttons (ex user login, watch auctions etc)
    - added some alt tags to images
    - improved ( I hope ;) ) overall user exprience when browsing the site

    [HR][/HR]
    Installation:

    Step 1
    Open cores folder. Copy and replace files in your webid directory with files from core folder. Overwrite all.

    Step 2
    Copy folder webid-bootsrap-standard in theme into you Webid themes folder and activate theme from admin panel.

    Step 3
    If you decide to use default look, you are ready to go. If you want to use different colors for example dark theme you have to adjust css styles for highlighted items so it will not highlight in pale yellow on dark background - see top of css/styles.css for more details what needs to be amended.

    Note
    Layout might be slightly off without any auctions. Just add one auction to fix it.

    [HR][/HR]





    [HR][/HR]

    Images

    1. webid-front-single-item-bootswatch-superhero.jpg

Recent Reviews

  1. M Hamdani ilham latjoro
    M Hamdani ilham latjoro
    5/5,
    Version: 2015-04-28
    nice