div by $ and bootstrap [Theme templates and Smarty help]

1

div by $ and bootstrap

2013/7/18 7:47
tatane
Just can't stay away
Posts: 649
Since: 2008/5/6 1

Hello
I have a code that is developed in tabular form.

 <{if count($categories) gt 0}> 
<div class="even" style="font-weight: bold;"><{$smarty.const._MD_XTUBE_MAINLISTING}>div> 
 
<table width="100%" cellspacing="1" cellpadding="3" summary='' style="text-align: center;"> 
    <tr> 
        <td colspan="2">&nbsp;td> 
    <tr> 
    <tr> 
         
        <{foreach item=category from=$categories}> 
        <td width="5%" style="text-align: center;"> 
            <a href="<{$xoops_url}>/modules/<{$module_dir}>/viewcat.php?cid=<{$category.id}>"><img src="<{$category.image}>" title="<{$category.alttext}>" alt="<{$category.alttext}>" align="middle"/>a> 
        td> 
        <td width="35%" style="text-align: left; vertical-align: middle;"> 
            <a href="<{$xoops_url}>/modules/<{$module_dir}>/viewcat.php?cid=<{$category.id}>"><b><{$category.title}>b>a>&nbsp;(<{$category.totalvideos}>)<br/> 
            <{if $category.subcategories}> 
            <div style="margin-bottom: 3px; margin-left: 16px; font-size: smaller; vertical-align: top;"> 
                <{$category.subcategories}> 
            div> 
            <{/if}> 
        td> 
        <{if $category.count is div by $cat_columns}> 
    tr> 
    <tr><{/if}> <{/foreach}> 
         
    tr> 
    <tr> 
        <td colspan="2">&nbsp;td> 
    <tr> 
table> 
<div class="odd" style="text-align: left; font-size: smaller;"><{$lang_thereare}>div> 
<div class="xoopstube_legend"> 
    <img src="<{$xoops_url}>/modules/<{$module_dir}>/images/icon/linkload1_small.png" title="<{$smarty.const._MD_XTUBE_LEGENDTEXTNEW}>" alt="" align="middle"/>&nbsp;<{$smarty.const._MD_XTUBE_LEGENDTEXTNEW}> 
    <img src="<{$xoops_url}>/modules/<{$module_dir}>/images/icon/linkload2_small.png" title="<{$smarty.const._MD_XTUBE_LEGENDTEXTNEWTHREE}>" alt="" align="middle"/>&nbsp;<{$smarty.const._MD_XTUBE_LEGENDTEXTNEWTHREE}> 
    <img src="<{$xoops_url}>/modules/<{$module_dir}>/images/icon/linkload3_small.png" title="<{$smarty.const._MD_XTUBE_LEGENDTEXTTHISWEEK}>" alt="" align="middle"/>&nbsp;<{$smarty.const._MD_XTUBE_LEGENDTEXTTHISWEEK}> 
    <img src="<{$xoops_url}>/modules/<{$module_dir}>/images/icon/linkload4_small.png" title="<{$smarty.const._MD_XTUBE_LEGENDTEXTNEWLAST}>" alt="" align="middle"/>&nbsp;<{$smarty.const._MD_XTUBE_LEGENDTEXTNEWLAST}> 
div> 
<{/if}>

In this code there are <{if $ category.count is div by $ cat_columns}> <{/ if}> which displays columns

If I use Table, I have that:
Resized Image

I would use thumbnails of bootstrap but I can not manage the columns

Do you understand? sorry for my bad english

2

Re: div by $ and bootstrap

2013/7/18 12:48
timgno
Module Developer
Posts: 1504
Since: 2007/6/21

Try changing the tables with those bootstrap and then if necessary, add a td line empty, you'll see that they approach the lists

3

Re: div by $ and bootstrap

2013/7/18 12:55
tatane
Just can't stay away
Posts: 649
Since: 2008/5/6 1

Ok but we no longer create this kind of display table, we need to use div.

How?

4

Re: div by $ and bootstrap

2013/7/18 12:59
timgno
Module Developer
Posts: 1504
Since: 2007/6/21

Instead of using this, with table tr:

 <{if $category.count is div by $cat_columns}>  
    tr><tr> 
<{/if}>

I use this:

 <{if $category.count is div by $cat_columns}>  
    <br class="clear"/> 
<{/if}>

5

Re: div by $ and bootstrap

2013/7/18 13:16
tatane
Just can't stay away
Posts: 649
Since: 2008/5/6 1

this my code

 <div class="thumbnails"> 
    <{foreach item=category from=$categories}> 
    <div class="thumbnail"> 
        <img src="<{$category.image}>" title="<{$category.alttext}>" alt="<{$category.alttext}>"> 
        <div class="caption"> 
        <h3><{$category.title}>h3> 
        <p><a class="btn btn-primary" href="#">Actiona> <a class="btn" href="#">Actiona>p> 
        div> 
    div> 
    <{/foreach}> 
div>

I tried

 <div class="thumbnails"> 
    <{foreach item=category from=$categories}> 
    <div class="thumbnail"> 
        <img src="<{$category.image}>" title="<{$category.alttext}>" alt="<{$category.alttext}>"> 
        <div class="caption"> 
        <h3><{$category.title}>h3> 
        <p><a class="btn btn-primary" href="#">Actiona> <a class="btn" href="#">Actiona>p> 
        div> 
    div><{if $category.count is div by 2}>  
    <br class="clear"/> 
<{/if}> 
    <{/foreach}> 
div>

But is not work

6

Re: div by $ and bootstrap

2013/7/18 14:25
timgno
Module Developer
Posts: 1504
Since: 2007/6/21

If you want to do a good job, you have to study better bootstrap with regard to selectors container, row and span, you'll see that you can.

7

Re: div by $ and bootstrap

2013/7/18 14:31
tatane
Just can't stay away
Posts: 649
Since: 2008/5/6 1

I know it takes only span with modules that are not modern I do what I can.

8

Re: div by $ and bootstrap

2013/7/18 20:26
timgno
Module Developer
Posts: 1504
Since: 2007/6/21

Quote:

tatane wrote:
But is not work

For the categories you need to create a script css, which aligns the row to the left with float: left, then make sure that the file xoops.css is allowed the selector clear, to wrap and remove all floats

See this example

9

Re: div by $ and bootstrap

2013/7/20 14:09
tatane
Just can't stay away
Posts: 649
Since: 2008/5/6 1

I added this code :

 <{assign var="thumbnail_span" value=span$thumbnail_span}> 
<{math assign="thumbnail_span" equation="12/nbr" nbr=2}> 
 
<div class="row-fluid"> 
<ul class="thumbnails"> 
    <{foreach item=category from=$categories}> 
    <li class="span<{$thumbnail_span }> thumbnail"> 
        <div class="center"> 
            <img src="<{$category.image_path}>" title="" alt=""/> 
        div> 
        <div class="center"> 
            <{if $selected_category == $category.categoryid}> 
                <strong><{$category.name}>strong>  
                <{else}> 
                <strong><{$category.categorylink}>strong>  
            <{/if}> 
        div> 
    li> 
    <{if $category.categoryid is div by 2}> 
 
    ul>div><div class="row-fluid"><ul class="thumbnails"> 
    <{/if}> 
    <{/foreach}> 
ul> 
div>

But it does not work (see images below)

Resized Image

10

Re: div by $ and bootstrap

2013/7/20 18:45
timgno
Module Developer
Posts: 1504
Since: 2007/6/21

Check well, you have a < / ul > final in the foreach loop too.

That job you can do it with < li > and < br / >

In more mistakes with the span.

The most that you can add as span is span12, so you have to make a division that gives results in all 12.

You put 3

and then 18, could not keep everything on the same line

Stats
Goal:	$100.00
Due Date:	Nov 30
Gross Amount:	$0.00
Net Balance:	$0.00
Left to go:	$100.00

div by $ and bootstrap

Re: div by $ and bootstrap

Re: div by $ and bootstrap

Re: div by $ and bootstrap

Re: div by $ and bootstrap

Re: div by $ and bootstrap

Re: div by $ and bootstrap

Re: div by $ and bootstrap

Re: div by $ and bootstrap

Re: div by $ and bootstrap

Login

Search

Recent Posts

XOOPS MyMenus 1.54.0 Beta 10

Re: XOOPS MyMenus 1.54.0 Beta 7

Re: XOOPS MyMenus 1.54.0 Beta 7

Re: XOOPS MyMenus 1.54.0 Beta 7

Re: XOOPS MyMenus 1.54.0 Beta 7

Re: XOOPS MyMenus 1.54.0 Beta 7

Re: XOOPS MyMenus 1.54.0 Beta 7

Re: XOOPS MyMenus 1.54.0 Beta 7

Re: XOOPS MyMenus 1.54.0 Beta 7

Re: XOOPS MyMenus 1.54.0 Beta 7

Who's Online

Donat-O-Meter

Latest GitHub Commits

{{ record.sha.slice(0, 7) }} - {{ record.commit.message | truncate }}