News:

Dear forum visitors, if the support forum is not available, please try again a few minutes later. Thanks!

Main Menu
Support-Forum

Multiple columns when listing category in article content

Started by sclg, 17.03.2018 19:24:16

Previous topic - Next topic

0 Members and 1 Guest are viewing this topic.

sclg

Following your excellent documentation, I can get all the files in a category to display in an article.
I'm using "Files link only V3.2" but there are over 30 files so you get a really long page!

Any easy way to make it multiple columns?
Ideally it would use the available width of the browser and responsively redraw as the viewport shrinks  ;D

Thanks

  •  

ColinM

Hi
I suspect they are coming out on separate lines because they are in paragrah elements created by your editor or by you typing a return after each each { } sequence.
One quick way is to set out in a table but that is not always good on small devices.
A better way is to put in as a series of <div> .. </<div> elements.
The practicality depends on which editor you are using.  Could you let me know?
  I am away for most of next week but will see if I can sort something.  How familiar are you with CSS and basic HTML?

Colin
Colin M
  •  

sclg

Hi
I'm using JCE and they are DIVs - looking in JCE code mode, it's...
<div>{jd_file onlinelayout==Files link only V3.2}</div>
<div>{jd_file category==8 count==0}</div>

I'm familiar with CSS, etc but not a world expert!

Steve
  •  

ColinM

Hi
I also use JCE.  I have done a very 'simple' solution as in the long term it needs to move to flexbox css in the Content plugin.  That is not a simple change!!
The key here is to have a <p> element before and after the set of jd content links, but note these <p> elements should be <p class="clearfix"> which you can easily add using the JCE style called clearfix. note the content could just be a space  Then you also need some custom css as below
If you are unfamiliar with adding custom css the see the appendix of http://www.jdownloads.net/documentations/item/custom-css-in-layouts


Below is a sample of the editor view
Editor view
This is just text on a line
{jd_file onlinelayout==Files link only v3.2}
{jd_file file==25}
{jd_file file==25}
{jd_file file==25}
separator on new line

Code view 
<p class="clearfix">This is just text on a line</p>
<div>{jd_file onlinelayout==Files link only v3.2}</div>
<div>{jd_file file==25}</div>
<div>{jd_file file==25}</div>
<div>{jd_file file==25}</div>
<p class="clearfix">separator on new line</p>

CSS added to jdownloads_custom.css
/* allow multi column content plugin   */
.jd_content_plugin {
  float: left;
}
li .jd_content_plugin {
  float: none;
}

Colin
PS it may not be pretty if the titles are very different lengths
Colin M
  •  

sclg

  •