How to hide headings in the list and implement customized css

Depending how heavily you want to customize it, you can either do it with a custom CSS file, or with a custom template. Let's assume you want to go the custom template route.

Copy the folder ...

./components/com_fabrik/views/list/tmpl/bootstrap

... to a new name, like search_results.

For the list you are displaying, edit the settings and set the template to be the new custom one.

Edit the default.php in your copy, and start removing code you don't need, like

Code: 
if ($this->hasButtons):
    echo $this->loadTemplate('buttons');
endif;

... will get rid of all the buttons.

Code: 
if ($this->showFilters && $this->bootShowFilters) :
    echo $this->layoutFilters();
endif;

... will get rid of element filters.

Code: 
<thead><?php echo $headingsHtml?></thead>

... will get rid of the headings.

-- hugh
 
Hugh, thanks. Also, I need to do some things.

To get rid from the pages counter and stylize the results of the page as I have prepared on the your-search-results page(my sites). How I can do it?

And one more thing to set similar distance between fields on the search form(my-sites) and put button closer to the form and for small screens put it on under all fields.
 
I can't see those links, I get ...

This site is down for maintenance.
Please check back again soon.

... which would require an admin login to get past.

-- hugh
 
Can you please close your other threads in the community forum to avoid duplicates? (uncheck "open" in Thread Tools)
 
987456123jw said:
Hugh, thanks. Also, I need to do some things.

To get rid from the pages counter and stylize the results of the page as I have prepared on the your-search-results page(my sites). How I can do it?

And one more thing to set similar distance between fields on the search form(my-sites) and put button closer to the form and for small screens put it on under all fields.
Click to expand...
??
 
Hugh, I need some feedback according my last post. I went a little bit ahead.

I have two issues now.
It is necessary to fix search form.
I have implemented css to the list data. But there is some strange situation.

There were three records. First records was in old fabrik`s style. Two others with new style. If I delete one record then one record become with old style and one with new. It is better to see.
 
This doesn't look like you've only copied the bootstrap list template and deleted the parts Hugh mentioned.
What is your default.php looking like?
Additionally I assume there is something like unbalanced divs, breaking the site layout.

If you want a catalog like style you better should start your custom template with a copy of the div list template.

Search form layout:
small screens put it on under all fields
Click to expand...
This is done automatically.
Maybe you should use Joomla's Protostar template, not sure what your lmb-external template is additionally doing.

Set all element layouts to Bootstrap class = span12 (which is 100%) so it won't overflow the span2-width
Date and slider elements may need additional tweaking because they are combined with buttons etc.
 
troester said:
This doesn't look like you've only copied the bootstrap list template and deleted the parts Hugh mentioned.
What is your default.php looking like?
Additionally I assume there is something like unbalanced divs, breaking the site layout.

If you want a catalog like style you better should start your custom template with a copy of the div list template.

Search form layout:
This is done automatically.
Maybe you should use Joomla's Protostar template, not sure what your lmb-external template is additionally doing.

Set all element layouts to Bootstrap class = span12 (which is 100%) so it won't overflow the span2-width
Date and slider elements may need additional tweaking because they are combined with buttons etc.
Click to expand...
It is possible to see on the Default file on the ftp. Credentials provided.
 
What do I need to search for to actually generate some results? The searches I've tried so far yield "no records".

-- hugh
 
All changes I did in the default_row.
cheesegrits said:
What do I need to search for to actually generate some results? The searches I've tried so far yield "no records".

-- hugh
Click to expand...
I suppose that this list will look the same as a after making search. In this case you should see your-search-results page.
 
OK, I've had a look at some of the stuff you are doing, and I'm not sure where to start on the problems.

Your default_row has a closing head tag, and html and body tags in it, and includes a conflicting version of jquery, which blows away everything else on the page using jQuery (like Fabrik). And it has some weird (and broken) "blocksit" script in it, and tries to include some Internet Explorer legacy HTML5 "sectioning" script. And tries to include the font-awesome CSS.

The default_row template is run on each "row" of data, and rendered inside the main the default template. You can't put html, head and body tags in there, and you can't include JS or CSS files from it.

It looks like you've just copied and pasted the output from some other page in there.

I think you need to take a step back, and give us some example of what you want the template to look like. As Troester said:

If you want a catalog like style you better should start your custom template with a copy of the div list template.
Click to expand...

The 'div' template is designed to be a starting point for producing what I think you are looking for.

-- hugh
 
Yup, this is pretty much the div template (which seems you are using now).

For icons instead of labels:
In Fabrik Options (Forms) you can enable "WYSIWYG editor for element labels"
Then you can edit your elements and use HTML code, e.g. icons instead of text for the labels
switch editor to the HTML mode and insert something like
Code: 
<span class="icon-calendar"></span>
 
Yes, I have changed template on the div. But, I need to change labels to the icons on the list elements not on the form. There is standart way to do it but it is not work.

How I can remove buttons from the list.
Also, I need to show elements which has Yes and not to show which has No(Parking and Balcony).

Where I can find WYSIWYG editor for element labels?
 
Last edited:
Buttons in the list:
set list access settings: edit, view, delete = nobody (create this Joomla access level and assign it to no group)

WYSIWIG editor for labels:
as I've said: enable it in Fabrik Options "Forms" tab

You can copy your list, set access settings only in the copy, edit the labels only in the copied elements ("unlink" from their parents when asked to do so) and use this copied list to represent the search results.

Edit:
I just found that you don't need the WYSIWIG editor for labels.
If you only want to change the labels for the list view put the code into "Heading label" in element's "List view settings". It seems here it's accepting HTML code without the Options WYSIWIG setting.
 
Last edited:
Troester, thanks.

How I can convert one column table to the two columns table and hide ":" for labels which I don`t want to show.
 
hiding :
In your div_search_list
edit default_row.php and remove the ":" in echo '<span class="muted">' . $label . ': </span>';

for two columns:
edit custom_css.php (maybe you have to copy and rename custom_css_example.php from the bootstrap template, not sure if it's in the div)
and add CSS for your single elements, e.g.
Code: 
#listform_$c .catalog___number_of_beds {
width: 50%;
float: left;
}
 
You must log in or register to reply here.

Useful links

  • Create a Fabrik Account (Downloads)
  • Create a Forum Account
  • Fabrik Wiki
  • Fabrik 4 Changelog /Install /Upgrade
    • We are in need of some funding.
    More details.

    Thank you.

    Members online

    Total: 145 (members: 1, guests: 144)
    Back
    Top