List Manager Forum
Images in directory listing
Hi,
in fact both options would be valid, if you go for the first one, setting the field as an html editor, you will surely have to configure the options of your editor, in order to show the button to upload images for the front-end users (it's usually hidden by default). Go to your system->plugins enter the tiny editor configuration and check the section TinyMCE Sets. There you will find which profile/s are allowed to use which toolbars of the editor, you can configure one set for your front-end users containing all features of the editor (advanced preset), so you should see all the toolbars showing at your front-end as well.
We think for just an image without any other content the more user-friendly option would be the second one, so they are directly prompted to upload without the other toolbars. However, for this option, the calculated php would be more tricky, because the upload field will create internally a html section, with an icon to download, the script, etc, so this must be parsed in order to get the uploaded file name and build the img tag, or query the db to get the image name wihtout the rest of the html. This would be the code for the calculated field:
$uploadfield="uploadf";
$tablename="yourdbtable";
$db = JFactory::getDbo();
$query = $db->getQuery(true)->select($uploadfile)->from($db->quoteName($tablename))->where($db->quoteName('id') . " = " . $id);
$db->setQuery($query);
$imagename = $db->loadResult();
$imagefield="<img src='media/com_listmanager/uploads/" .$imagename ."'>";
where you should replace '$imagefield' at the last line for the calculated field name (the one you want to show), and at the 2 first lines :
'uploadf' for the name of the upload field
'yourdbtable' for the name of the table at your database.
Please let us know if you need more help with this.
Best regards
Silvia Martín
Moonsoft Team
Thank you for your help. I'm out of the office for a week but I'll try both your solutions when I return.
Option 1: Of course! I don't use TinyMCE but JCE Editor instead. I'm not sure why TinyMCE opens as my html editor but I'll get it figured out.
Option 2: Thank you for the code, it's likely the solution I'll take. I'm not much of a coder and ChatGPT wasn't helpful.
–Dean
Hi,
ok, no problem, we keep the ticket open until you solve. Regarding option 1: we always open the tinyMCE as the default editor, because not every third party editor works smoothly when inserted into other extensions, and it was causing issues that we couldn't solve, as we can't modify other component's core code and still allow them to update, so we couldn't ensure compatibility with every other editor. Maybe in the future we'll allow to use a restricted set of editors commonly used that we know are fully compatible.
Regards
Silvia Martín
Moonsoft Team
(My original support question was through the contact form, not a support ticket).
Thank you for your quick response and I was able to make both options work, but for my situation I'm still unclear what to do. The data for this directory will be entered by people who have no access to the backend and will not know the addresses of the image urls. Here's what I tried:
• Setting the field type as 'html editor'. However, the editor doesn't allow me to upload an image using a browser or drag-and-drop like the editor does in a typical article. The people entering data need to be able to do so.
• As a workaround, I created a field and set it as 'Upload File' which allows the user to select the image. I tried making another field that calculates the <img> tag by calculating its location like your second example. However, the uploaded file don't appear to be directly accessible by a static URL so the calculation fails.
My goal is to allow the user to upload the image, and that image displays with an <img> tag in the listing. Thank you for any assistance you could provide.