You can easily modify the CSS of DJ-Classifieds to display the custom fields in more than one column .
I will show how you can do it using our demo installation as an example.
The example product we will be working on is
https://demo.dj-extensions.com/dj-classifieds-new/single-ad-view-with-buy-now
.
Once the product is displayed in the browser (I am using Chrome, but you can find similar options in other browsers) right-click one of the custom fields and choose “Inspect”.
When in Inspect mode, click on div with class “
custom_det_content
” to see the CSS path in your Joomla installation.
In my case, it is:
https://demo.dj-extensions.com/dj-classifieds-new/components/com_djclassifieds/themes/clean/css/style.css
Now, I find the CSS file in the FTP client and open the file.
now, in the file we need to add:
- #dj-classifieds .dj-item .custom_det_content {
- column-count: 2;
- }
and
save
the file.
Now, there are two columns available:
You can, of course, use a different number of columns if needed.
The solution I will show you is the most simple one and need to be done again once the extension is modified.
Follow this tutorial to add your own styles to Joomla-Monster’s templates:
https://www.joomla-monster.com/documentation/template-tutorials/how-to-add-your-own-css-styles-to-joomla-template-based-on-ef4-framework
In my case, I have added to the
custom. less
:
- #dj-classifieds .dj-item .custom_det_content {
- column-count: 2;
- }
the effect is the same, two columns added + you are safe with the updates.
This code comes from our reader, who decided to praise him in the comment.
And that is the result: