i've created a Custom Content Element with Fluid and Extbase (TYPO3 6.1), in which you can define a picture.
In the picture-settings i can set a img-link, which is targetting a file.
In my Controller i can access this data with
$this->configurationManager->getContentObject();
But i just get a file-reference for this setting and no path. like this:
file:1206
I've googled a lot and i didn't find a solution to access the path. Has anybody a solution or knows maybe a function in the configurationmanager or something else? I've spend hours on this problem...
Thanks a lot!
If you need to get image from FAL than use following image view helper
<f:image src="{object.image_field.uid}" alt="{object.image_field.originalResource.title}" width="640" height="291" treatIdAsReference="1" />
If you just need url of image than use following line
{object.image.originalResource.publicUrl}..
Hurray.
What you have there, is a file reference of FAL, the file abstraction layer.
First things first, if you use FlexForms in combination with ActionController (or any realisation of AbstractController) you should be able to access the settings property to compute your FlexForm values.
To compute sys_file_reference records, you should refer to the FAL docs on typo3.org (and the perma-linked section about file and folder handling).
In general, you should be able to call getOriginalResource() on a \TYPO3\CMS\Extbase\Domain\Model\FileReference object. For more concrete examples, either refer to the doc links or have a look at the wiki for a example handling FileReferences.
If you want to compute such reference via fluid templating, you can use the treatIdAsReference argument on f:image:
<f:image src="{imageObj.uid}" width="150" height="100" treatIdAsReference="1" />
He is asking for a path and not for an image. This prints the path in fluid templates:
{f:uri.image(src:'{object.uid}',treatIdAsReference:'1')}
Related
I try to translate some labels in a mask content element (TYPO3 10). I first created the mask element and mask created a directory "typo3conf/ext/mask_project". I created the file "typo3conf/ext/mask_project/Resources/Private/Language/locallang.xlf" and put a label "read_more" in there.
In my FLUID template ("typo3conf/ext/mask_project/Resources/Private/Mask/Frontend/Templates/Staff.html") I tried:
<f:translate key="EXT:mask_project/Resources/Private/Language/locallang.xlf:read_more" />
<f:translate key="LLL:EXT:mask_project/Resources/Private/Language/locallang.xlf:read_more" />
Unfortunately nothing is printed out. Does anyone has an idea?
The LLL:EXT:...:... syntax is correct (https://docs.typo3.org/other/typo3/view-helper-reference/10.4/en-us/typo3/fluid/latest/Translate.html) for accessing full paths. For the default file location, you would usually not have to add the whole path (this depends a bit on the FLUIDTEMPLATE configuration). In your case you can also use the ViewHelpers extensionName= parameter.
Some hints if you still get no output:
For new labels to be known, you'll need to clear the system cache.
https://docs.typo3.org/m/typo3/reference-coreapi/10.4/en-us/ApiOverview/Internationalization/XliffApi.html
https://docs.typo3.org/m/typo3/book-extbasefluid/master/en-us/9-CrosscuttingConcerns/1-localizing-and-internationalizing-an-extension.html
im trying to add an additional source to the dce-image for further actions e.g. an alternate source to perform some JavaScript actions.
The wanted output should look like this:
<img src="path/to/foo.png" data-altsrc="path/to/bar.png">
The problem is the dce i'm using - its iterating through the "images" like this:
<f:for each="{dce:fal(field:'image', contentObject:contentObject)}" as="fileReference">
<f:image src="{fileReference.uid}" treatIdAsReference="1" />
</f:for>
So if I would insert multiple images to this I have no real relation between the images where i know which one is the normal-source and which one is the alternate source.
So there was the possibility to create a section and add two fields for images which we can restrict to one image per field. But there again is the for-loop which doesn't allow me to access the source of the second image for the first image.
It should be a visible relation between these images for the user which is working with the dce.
Im trying to achieve something like this:
<f:for each="{field.images}" as="images">
<!-- want to achieve something like this -->
<f:image image="{images.foo.src}" data-altsrc="{images.bar.src}">
<!-- thats the normal way iterating through images -->
<f:for each="{images.foo}" as="image">
<f:image image="{image}" />
</f:for>
</f:for>
Another idea would be to iterate first through the alternate images and store them into an array and on the main-images to access them but I have no idea if this is even possible also this will restrict the usability of the dce for the user.
Is there any way to achieve this with dce-fluid ?
Thanks in advance
Well, i guess you could extend the sys_file_reference table to add a relation from there. So you would have nested relations (never done that, so you would have to try).
You would also have to add the field to the tca type in the place you need it, that could be a little tricky. Have a look at Tca types overrides.
You could extend the sys_file_reference table with a field "alternative_reference" and add the neccessary TCA setup. Then you would have to retrieve the FileReferences via the FileRepository and use sys_file_reference as foreign table (and of course the sys_file_reference uid as identifier).
FileRepository::findByRelation(
'sys_file_reference',
'alternative_reference',
$uidOfActualSysFileReferenceRecord
);
The other possibility would be a completely new record with 2 different sys_file_reference relations. That record (eg: tx_ext_domain_model_imageset) would have an image_default and image_alternate field, both would be configured as file_relations. That would work for sure.
$defaultImages = FileRepository::findByRelation(
'tx_ext_domain_model_imageset',
'image_default',
$uidOfRecord
);
$alternativeImages = FileRepository::findByRelation(
'tx_ext_domain_model_imageset',
'image_alternative',
$uidOfRecord
);
I assume you do have knowledge about creating records, models, tca and so on.
I personally would prefer the second way, it is more clean and does not change the core-table structures.
Also there is a second image generation viewhelper, that might suite your needs better
<img src="{f:uri.image()}" data-altsrc="{f:uri.image()}" />
But the best way to go might be to write your own ViewHelper for that purpose. You could pass your Object (ImageSet) as parameter and handle all logic there. So your template would be simpler and easier to read/work on.
You have to use data attribute of fluid viewhelper and then get the uri of the image with inline call. Here is how to achieve :
<f:image src="{fileReference.uid}" data="{altsrc: '{f:uri.image(src: \'{fileReference.uid}\', treatIdAsReference: 1}" treatIdAsReference="1"/>
This should do the work.
I want to crop images in Fluid with the f:image or the f:uri.image viewhelper (TYPO3 8.7). Since TYPO3 7.2 the usual way does not work anymore:
This:
<f:image image="{file}" width="500c" height="500" />
does not work.
In the fluid guide I found the hint that since TYPO3 7.2 I have to use crop. I found this in the change log:
https://docs.typo3.org/typo3cms/extensions/core/7.6/Changelog/7.2/Feature-65584-AddImageCropping.html
So this should work, but it doesnt:
<f:image image="{file}" crop="0,0,500,500" />
The images are rendered but in default size.
Any ideas? Anything changed in later versions?
I tried with a fresh installation and found my fault.
cropping with c and m does indeed work in TYPO3 8 - the hint in the fluid manual is wrong.
in short syntax you have to use '' in order to send the c or m correct.
This syntax is wrong:
<img src="{f:uri.image(image:file, width:200c, height:200)}">
there is no error message and the images are rendered but the letter c is ignored. You have to use this syntax:
<img src="{f:uri.image(image:file, width:'200c', height:'200')}">
this will work.
One additional hint: after changing the syntax the images are not rendered every time but only when the size has changed. Sometimes you get simply the cached images ... Deleting the content on /fileadmin/_temp does help.
Well - perhaps it will help some one :-)
You can use f:image like below. it's work for me.
<f:image src="{file.originalResource.publicUrl}" width="770c" height="517c" height="350c" />
You could also specify the crop settings in tca and use this settings in the FE, for an example look at the repository : https://github.com/frans-beech-it/t3ext-config_examples.
Besides that, in the install tool you can check if cropping works on your machine. It can happen that there are already processed images for your size, if you adjust the cropping information of image with 1px a new processed image is created. If then the image works, clear the processed files to generate a new image for your desired formats.
As far as I know, there's no such thing as an f:link.file or v:link.file viewhelper.
There used to be a solution using file.originalResource.publicUrl as the value to point the link to, as in
<f:link.page pageUid="{file.originalResource.publicUrl}" target="_blank">
Am I right that this is no longer necessary? I got this (using ext:mask):
<f:link.page pageUid="{file.identifier}" target="_blank">
returning the same value, while originalResource.publicUrl would not even show up in f:debug.
BUT in file.identifier the storage path, e.g. fileadmin, is not present. How do I add it to the viewhelper?
Or, what is the currently recommended solution for a link to a file in TYPO3 7.6?
Just use {file.name}. When absolute URL or some special configuration is needed use <f:link.typolink parameter="{file.publicUrl}">{file.name}</f:link.typolink>.
TYPO3 11 introduced a new ViewHelper for this
<f:link.file file="{file}" target="_blank">Download</f:link.file>
https://docs.typo3.org/other/typo3/view-helper-reference/11.5/en-us/typo3/fluid/latest/Link/File.html
For me, #minifranske’s solution worked only as a hint: I needed to use {file.originalResource.publicUrl} instead:
<f:link.typolink parameter="{file.originalResource.publicUrl}">{file.originalResource.title}</f:link.typolink>
also available:
{file.originalResource.name}
{file.originalResource.description}
{file.originalResource.alternative}
Nevertheless, if anybody knows a proper core solution which resembles that of the Rich Text Editor, I’d be happy to hear about it:
file link
page link
<f:uri.image image="{imageObject}" /> produces the path + filename for your FAL object.
I have an standard image upload in TYPO3 Backend, that allows more than 1 image upload.
So I have an image database field with data like that: "image1.jpg,image2.jpg".
In Frontend, I can explode the field, send the array to fluid, and output it in a fluid:for each like that:
<f:image src="uploads/tx_myext/{image}" />
First question is: is there maybe some fancy new Extbase or Fluid Magic, that creates image objects right from database?
Second question: if I have a huge 2MB image and make a fluid:image output with width=100, is it just scaled in browser, or is it really downsized using ImageMagick?
Comma list to array:
Unfortunately as I can see in Extbase 4.7 there is still no ViewHelper for iterating comma separated strings. You have two options: write custom ViewHelper or stay with the way you are using.
TIP: To avoid passing additional params (especially when you have many comma separated fields there and/or using many Partials for rendering the view) I'm adding a public field to my model. Without representation in TCA it will be considered as transient, ie:
/**
* #var array
*/
public $imagesArray;
and then just filling it in controller right before assigning so I can access it as {project.imagesArray} in the view:
public function showAction(Tx_Myext_Domain_Model_Project $project) {
$project->imagesArray = explode(',', $project->getImage());
$this->view->assign('project', $project);
}
view
<f:for each="{project.imagesArray}" as="image">
<f:image src="uploads/tx_myext/{image}" width="200" height="200m" alt="" />
</f:for>
Most probably you are using quite similar approach...
Image resizing:
It's easiest just to ... check. ImageMagick hashes the name of the resized image and stores it in the temp folder by default, so if in code preview you see the path like: typo3temp/pics/cd27baa408.jpg instead of uploads/tx_myext/photo123.jpg that means it was converted with IM. And yes, image ViewHelper uses the IM.
You can even add perform simple calculations by giving value as width="200m" or width="200c" from viewhelper's phpdoc: See imgResource.width for possible options
Now I created a ViewHelper in Typo3 Forge as I think processing of images as they come from database would be quite usefull.
And I added imageLinkWrap for JS Window.
http://forge.typo3.org/issues/46218