Custom module images not displaying after adding a secondary frontend language
I used the following Sitefinity documentation to add multilingual functionality to a site that already had content.
Persist multilingual fields in separate tables for each language
docs.sitefinity.com/administration-persist-multilingual-fields-in-separate-tables-for-each-language
Checked both Use Split Tables and Use Fetch Strategy
Language Settings
docs.sitefinity.com/administration-language-settings
Added French as a language
Set URL structure to use directories i.e. domain.com/es
After doing some, any images for custom modules (built with Module Builder) are not displaying or being pulled through onto the frontend for either language.
Below is an example of a template that is being used. All information is displaying correctly apart from any image related property (i.e. Background and Image) which appears to have no data. When editing the custom module item for either language I can see that both properties have an image.
<%@ Control Language="C#" %>
<%@ Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.DynamicModules.Web.UI.Frontend" TagPrefix="sf" %>
<%@ Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI.Fields" TagPrefix="sf" %>
<%@ Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI" TagPrefix="sf" %>
<%@ Import Namespace="SitefinityWebApp.Common" %>
<%@ Import Namespace="Telerik.Sitefinity.Web.UI" %>
<sf:DynamicDetailContainer id="detailContainer" runat="server">
<LayoutTemplate>
<div class='flexslider-hero flexslider-<%# Eval("UrlName") %>'>
<asp:Repeater runat="server" runat="server" DataSource='<%# Eval("SliderItems") %>'>
<HeaderTemplate>
<div class="flexslider">
<ul class="slides">
</HeaderTemplate>
<FooterTemplate>
</ul>
</div>
</FooterTemplate>
<ItemTemplate>
<li>
<a href='<%# Eval("ButtonUrl") %>'>
<picture>
<!--[if IE 9]><video style="display: none;"><![endif]-->
<source media="(min-width: 768px)" srcset="<%# Eval("Background.MediaUrl") %>">
<source media="(min-width: 480px) and (orientation: landscape)" srcset="<%# Eval("Background.MediaUrl") %>">
<source srcset="<%# Eval("Image.MediaUrl") %>">
<!--[if IE 9]></video><![endif]-->
<img class="img-responsive center-block" src="<%# Eval("Background.MediaUrl") %>" alt="<%# Eval("Background.AlternativeText") %>" />
</picture>
</a>
</li>
</ItemTemplate>
</asp:Repeater>
</LayoutTemplate>
</sf:DynamicDetailContainer>
Any ideas on what might be happening?
Hello Sean,
Can you please make sure that you have translated the images in the specified language? If the image is not translated in a particular language version it will not be displayed when browsing this language version of the page.
Regards,
Sabrie Nedzhip
Telerik
Replying to Sabrie Nedzhip comment
Replying to First comment
Reply to Sean
Does that mean I have to have a image available for each language?
Is it possible to show the EN language per default? Because it is not doable for us to change that many pictures.
I am currently trying to add an image to my list-template and it is not showing after I installed two more languages.
<%@ Control Language="C#" %>
<%@ Register TagPrefix="sf" Namespace="Telerik.Sitefinity.Web.UI.PublicControls.BrowseAndEdit" Assembly="Telerik.Sitefinity" %>
<%@ Register TagPrefix="sf" Namespace="Telerik.Sitefinity.Web.UI.ContentUI" Assembly="Telerik.Sitefinity" %>
<%@ Register TagPrefix="sf" Namespace="Telerik.Sitefinity.Web.UI.Comments" Assembly="Telerik.Sitefinity" %>
<%@ Register TagPrefix="sf" Namespace="Telerik.Sitefinity.Web.UI.Fields" Assembly="Telerik.Sitefinity" %>
<%@ Register TagPrefix="sf" Namespace="Telerik.Sitefinity.Web.UI" Assembly="Telerik.Sitefinity" %>
<%@ Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Modules.Comments.Web.UI.Frontend" TagPrefix="sf" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<%@ Import Namespace="Telerik.Sitefinity.Web.UI" %>
<%@ Import Namespace="Telerik.Sitefinity.Modules.Comments" %>
<
sf:SitefinityLabel
id
=
"title"
runat
=
"server"
WrapperTagName
=
"div"
HideIfNoText
=
"true"
HideIfNoTextMode
=
"Server"
CssClass
=
"sfitemFieldLbl"
/>
<
telerik:RadListView
ID
=
"dynamicContentListView"
ItemPlaceholderID
=
"ItemsContainer"
runat
=
"server"
EnableEmbeddedSkins
=
"false"
EnableEmbeddedBaseStylesheet
=
"false"
>
<
LayoutTemplate
>
<
ul
>
<
asp:PlaceHolder
ID
=
"ItemsContainer"
runat
=
"server"
/>
</
ul
>
</
LayoutTemplate
>
<
ItemTemplate
>
<
li
>
<
a
href
=
"<%# Eval("
Link")%>">
<
img
src='<%# Eval("Image.MediaUrl")%>' alt='<%# Eval("Image.AlternativeText")%>' title='<%# Eval("Image.Title") %>' />
<
h2
><%# Eval("Title")%></
h2
>
<
p
><%# Eval("SubTitle")%></
p
>
</
a
>
</
li
>
</
ItemTemplate
>
</
telerik:RadListView
>
<
sf:Pager
id
=
"pager"
runat
=
"server"
></
sf:Pager
>
Was there any answer to this or did support just let it die? Still an issue in 9.2. Has anyone found a useful workaround?
Hi Stos
We had to re-publish the images in the relevant languages.
Thanks for the reply, Sean.
That's unfortunately not a sustainable model, especially when we're trying to manage hundreds of partner logos for three languages and dozens of regions. Hopefully our Progress friends have some ideas. I'll post back here if we find a work around. Or maybe Progress will post their ideas too. ;-)
Hi Stos,
In my mind i have this idea:
Subscribe to IDataEvent (docs.sitefinity.com/for-developers-idataevent), check if it is image and it is newly created image, then automatically create another translations for this image
Thanks Victor. That's an interesting solution, but, for our particular situation, we have almost constant updates to these images so I would also need to extend that to replace/delete when appropriate. I suppose we could extend what you suggested to those actions, although I don't know if it would work unless we tried it.
For now, we're going to try a different custom module that will call the default language object and it's related image URL, and then use that to display the image in the other languages. Sort of creating a custom language fallback. We'll see if it works!
I know it might not be appropriate in this forum but I want to give a shout out to petracoredesign.com who have been my Sitefinity partner of choice for many years. They don't know I'm posting this, but they are the ones coming up with innovative solutions to these issues. I would be lost without them.
You don't need to handle update operation, because image blob by default is common for all languages (if you will update image in EN, it will affect other languages as well). And you still need to handle delete.
My solution will have better performance and very easy to implement. And it's working perfectly with different storages (for ex. CDN).
If you have difficulties with that, let me know, i will write some code sample how to do that
Here the working sample github.com/.../sitefinity-image-auto-translation
Thanks. We're all set. Not sure details of what my guys did, but it works well for what we need. Thanks again for your suggestions.