1
tatane
tdmdownloads and bootstrap
  • 2013/6/22 9:57

  • tatane

  • Just can't stay away

  • Posts: 649

  • Since: 2008/5/6 1


Hello
I'm trying to adapt the bootstrap tdmdownload module.

I would like to display on the page viewcat.php 4 images on two lines which therefore 8 images. To setup this kind of display, so I set my preference as :

Resized Image


Tdmdowloads_viewcat.html the side, I modified the template by adding span adaptable to make my pictures, here is the code tdmdowloads_viewcat.html


<{if $file != ""}>

<
div class="container-fluid">
<
div class="row-fluid">

    <
ul class="thumbnail">
    <{
section name=i loop=$file}>
        <
li class="span3"><{include file="db:tdmdownloads_download.html" down=$file[i]}></li>
    <{/
section}>
    </
ul>
    </
div>
</
div>    

    <{if 
$pagenav != ''}>
    <
div class="tdmdownloads-pagenav"><{$pagenav}></div>
    <{/if}>
<{/if}>


With this type of code that shows me <ul class="thumbnail"> for 8 images or having a span of 3, I need a <ul class="thumbnail"> for a column of 4 images.

Resized Image


What php file I need to change to create a class="thumbnail"> <ul between each column?

2
studioC
Re: tdmdownloads and bootstrap
  • 2013/6/22 21:17

  • studioC

  • Friend of XOOPS

  • Posts: 922

  • Since: 2003/12/7


I'm not sure if i understand correct what you want to achieve. (Puuuh, there are so many nested divs there ...)

To sum up in short, what i understand:

You want to display an unordered list with 8 list-Elements but not "the normal way" with a list in one column but within 2 columns/blocks?, 4 list-Elements left and 4 list-Elements right, is it that simple?

Michael

3
tatane
Re: tdmdownloads and bootstrap
  • 2013/6/23 7:20

  • tatane

  • Just can't stay away

  • Posts: 649

  • Since: 2008/5/6 1


Hello studioC

I finally succeeded. Here is my code:

<{if $file != ""}>
<
div class="container-fluid">
    <
div class="row-fluid">
        <
ul class="thumbnails">
            <{
section name=i loop=$file}>
                <
li class="span4"><{include file="db:tdmdownloads_download.html" down=$file[i]}></li>
            <{if 
$file[i].count is div by $nb_dowcol}>
        </
ul>
        <
ul class="thumbnails">
            <{/if}>
            <{/
section}>
        </
ul>
    </
div>
</
div>
    <{if 
$pagenav != ''}>
        <
div class="tdmdownloads-pagenav"><{$pagenav}></div>
    <{/if}>
<{/if}>


This now allows for categories responsive bootstrap

4
studioC
Re: tdmdownloads and bootstrap
  • 2013/6/23 7:41

  • studioC

  • Friend of XOOPS

  • Posts: 922

  • Since: 2003/12/7


Fine, so you make 2 (or more) ul's out of one, if there is an item divided by 4 = 1

Can you show me the html Output of that, please?


I thought different for i wouldn't love to kill the structure of an unordered list. Last Night i made a quick an Dirty test with Mylinks categories display. I made 8 categories but "divided" the list only to be visible like a two column with css only.

mylinks 2 column category list using unordered list

Look into the source, One unordered list using CSS to display a 2 colum Arrangement.
Didn't know if i would use it this Way, though.

It was just quick and Dirty and Thats not what you Need but for me it was Fun

Keep on good work and have fun, playing with xoops!
Michael


5
tatane
Re: tdmdownloads and bootstrap
  • 2013/6/23 8:04

  • tatane

  • Just can't stay away

  • Posts: 649

  • Since: 2008/5/6 1


Quote:

studioC wrote:
mylinks 2 column category list using unordered list

Look into the source, One unordered list using CSS to display a 2 colum Arrangement.


The problem is that the images in an array, the responsive system does not work so you have to create the div


Quote:
Can you show me the html Output of that, please?

Resized Image


and my preference tdmdownload

Resized Image


This means that there are 9 images on three columns. Unfortunately for the span of bootstrap I have to manually adjust the image according to the numbers

Login

Who's Online

72 user(s) are online (44 user(s) are browsing Support Forums)


Members: 0


Guests: 72


more...

Donat-O-Meter

Stats
Goal: $100.00
Due Date: Jul 31
Gross Amount: $0.00
Net Balance: $0.00
Left to go: $100.00
Make donations with PayPal!

Latest GitHub Commits