Search
Other Articles Field questions
Forum

custom HTML output in a grid

SAS Webdevel's Avatar SAS Webdevel
If I want my output to display in a grid, how could I do that using the custom format HTML in articles field?

For example: snipboard.io/fuacLT.jpg

Col 1 Col 2 Col 3
Image1 Image2 Image 3
Title1 Title2 Title3

Image4 Image5 Image6
title4 Title5 title6

What I currently have:
snipboard.io/U6qHkb.jpg

Currently, I am just displaying it 'going vertical'.

I have a pro subscription to Articles anywhere as well, if I should be doing something with that.

Thanks,
Laura
Peter van Westen's Avatar Peter van Westen ADMIN
With the Custom HTML you can only set the html pper item. Not the surrounding (container) html.
If you want full control of what html you place around the entire list of items, use a template layout override for the field.
Please post a rating at the Joomla! Extensions Directory
SAS Webdevel's Avatar SAS Webdevel
Peter,
Can you provide a little guidance on the template layout override for the field?

1. Which field HTML am I creating a new layout for?
2. If I create a new layout can I select the layout for the specific field only? How would I do that?

Have you seen this done before?

thanks,
Laura
SAS Webdevel's Avatar SAS Webdevel
we were able to figure out a way to do this with CSS / bootstrap... maybe this can be added in as an option:

1. Created a specific class for the image field to include object-fit: cover, and a specified width and height, this way the image would display as a square

2. Articles Field setup

Tab: Options Class
Display options: value class: d-flex flex-wrap

3. Articles Field HTML Setup

Tab: General
HTML Setup

<span class="m-2 d-flex flex-column align-items-stretch">
<a style="display:block;" href="[url]">[profile-image]</a>
<a style="display:block;" href="[url]"><strong>[formattedname]</strong></a>
</span>

End result:
https://snipboard.io/fXgb2k.jpg

thanks,
Laura
Peter van Westen's Avatar Peter van Westen ADMIN
The way you solved this is one of the ways you can.

How to style things is down to the css and template (and whatever custom html you want to output).
This is outside the scope of Articles Field to control. So it won't be added as a 'ready-to-use' option.
Please post a rating at the Joomla! Extensions Directory
SAS Webdevel's Avatar SAS Webdevel
I understand completely, thank you. I'm happy I got it to work.

thanks,
Laura
You can only post on the extension support forum if you have an active subscription and you log in

Buy a Pro subscription