Loading...
 
Skip to main content

Features / Usability

Forum List Topic List

Forums » Features / Usability » Plugin List - how can column width be set? » Plugin List - how can column width be set?
You are viewing a reply to Plugin List - how can column width be set?
 
Thread actions
Print this page
  • Print all pages

    • Plugin List - how can column width be set?

    Posted by Mike Finko posts: 228 Ukraine

    Hi,
    Any chance anyone could shed some light on setting fixed column width (px or %) for Plugin List?

    I put in a considerable amount of effort into using Plugin List for a project but at the end of the day, ended up using Plugin Tracker List as column width was a necessity.
    However, going forward i am hitting the limitations of Plugin Tracker List, so have no choice.

    Any help would be hugely appreciated,
    Thanks,
    Mike

    Reads: 664
    Posted by Bernard Sfez / Tiki Specialist posts: 8654 France
    Mike Finko wrote:

    Hi,
    Any chance anyone could shed some light on setting fixed column width (px or %) for Plugin List?

    I put in a considerable amount of effort into using Plugin List for a project but at the end of the day, ended up using Plugin Tracker List as column width was a necessity.
    However, going forward i am hitting the limitations of Plugin Tracker List, so have no choice.

    Any help would be hugely appreciated,
    Thanks,
    Mike


    I'll be glad to help, but something is missing... The plugin List doesn't manage the width of a col.
    It is your output block and eventually a template.
    Can you show us (me) more ?

    Posted by Mike Finko posts: 228 Ukraine

    Hi Bernard,
    It's a pretty standard list displaying all open/pending Tracker items (currently in Plugin Tracker List), so standard columns like 'First Name', 'Last Name', 'Age', etc.
    So just like this one https://doc.tiki.org/PluginList-output-control-block#Format_parameters

    I did not find any explanations in the Plugin List Docs about using a template to display a list, just to display a List in Table format:

    {CODE(colors="tiki" theme="default")}{OUTPUT(template="table")}{CODE}

    Maybe I just need to add a "width = "50%"" parameter in the column? Like:

    Copy to clipboard
    {column sort="title" label="Title" translatelabel="y" field="title_link" mode="raw"}


    br,
    Mike

    Posted by Jonny Bradley posts: 126892 United Kingdom

    Hi @Mike -UA

    I think the best you can do is to use the class parameter on the {columns} and set up some classes in the custom css to suit, e.g.

    Copy to clipboard
    {column sort="title" label="Title" translatelabel="y" field="title_link" mode="raw" class="50percent"}

    and in custom css (in the Look and Feel Control Panel)

    Copy to clipboard
    .50percent {
  width: 50%;
}
    Posted by Mike Finko posts: 228 Ukraine

    That looks simple enough! Definitely will give it a go -
    Thanks, Jonny!
    p.s. and HUGE thanks for the 2000+ NLAW's which will sure make them think twice 😀

    Posted by Mike Finko posts: 228 Ukraine

    ok, tested, didn't want to work. tried a bunch of variations, checked my Settings (though maybe 'class' needed to be activated, but did not find), Cleared all my 'Custom CSS', though something could be conflicting, not that. Tried on a clean, super minimal Plugin List, nothing.

    Then I remembered in Python, a variable cannot start with a number. Hmm, is this a variable in CSS? Worth a try, so I changed to:

    Copy to clipboard
    .fifty_percent {
  width: 50%;
}


    And it worked!
    br,
    Mike

    Posted by Jonny Bradley posts: 126892 United Kingdom

    Hi Mike

    Nice catch, sorry about that, you are correct - as confirmed here

    Hope everything works out ok over there, good luck!


    Posted by Bernard Sfez / Tiki Specialist posts: 8654 France

    {CODE()}
    {OUTPUT(template="table")}
    {CODE}

    Was missing to answer, but Jonny gave a simple good option (I would have use bootstrap col- classes).

    Note that (I experienced it a lot), if the problem was avoiding word wrap you can also use the bootstrap class: "text-nowrap"

    https://getbootstrap.com/docs/4.3/utilities/text/