I am working on building dnn9 multilingual site. I put language selection dropdown in theme.
To show dropdown in theme I am using this code:
<% if Localization.ActiveLanguagesByPortalID(PortalSettings.PortalId) > 1 Then %>
<dnn:LANGUAGE runat="server" ID="LANGUAGE1" ShowMenu="True" ShowLinks="False" />
<% End If %>
Now it shows long language names, like that: English (United States). How can I make it show 3 latter language name, like ENG, instead?
I use the following:
<dnn:LANGUAGE runat="server"
ID="dnnLanguage"
ShowLinks="True"
ShowMenu="False"
ItemTemplate='<span class="Language" style="text-transform: uppercase;">[CULTURE:THREELETTERISOCODE]</span>'
AlternateTemplate='<span class="Language" style="text-transform: uppercase;">[CULTURE:THREELETTERISOCODE]</span>'
SelectedItemTemplate='<span class="Language selected" title="[CULTURE:NATIVENAME]" style="text-transform: uppercase;">[CULTURE:THREELETTERISOCODE]</span>'
/>
That displays links with the three letter ISO-Code, and a popup with the native name when hovering over them.
There is no need to check whether there is only one language or more, as the skin object is hidden automatically when only one languge is activated, or the current page is not translated (or the translations are not published) yet.
Related
Whenever I try to make a custom skin object in Admin/Skins folder or Admin/Containers folder, I get the error
Uncaught ReferenceError: jQuery is not defined
I'm trying to add a bootstrap link skin object to be used in the template. DNN Newbie here!
<%# Control Language="C#" AutoEventWireup="false" Inherits="DotNetNuke.UI.Skins.Skin" Codebehind="Button.ascx.cs" %>
<%# Register TagPrefix="dnn" Namespace="DotNetNuke.UI.WebControls" Assembly="DotNetNuke.WebControls" %>
<asp:button id="btnButton" runat="server" cssclass="Normal" enableviewstate="False" MouseOverCssClass="LabelEditOverClass"
ToolBarId="titleToolbar" LabelEditCssClass="LabelEditTextClass" EditEnabled="True" EventName="none" LostFocusSave="false"></asp:button>
<DNN:DNNToolBar id="titleToolbar" runat="server" CssClass="eipbackimg containerTitle" ReuseToolbar="true"
DefaultButtonCssClass="eipbuttonbackimg" DefaultButtonHoverCssClass="eipborderhover">
<DNN:DNNToolBarButton ControlAction="edit" ID="tbEdit2" ToolTip="Edit" CssClass="eipbutton_edit" runat="server"/>
<DNN:DNNToolBarButton ControlAction="save" ID="tbSave2" ToolTip="Update" CssClass="eipbutton_save" runat="server"/>
<DNN:DNNToolBarButton ControlAction="cancel" ID="tbCancel2" ToolTip="Cancel" CssClass="eipbutton_cancel" runat="server"/>
</DNN:DNNToolBar>
Edit:
I'm trying to create various skin objects like button, title tags, body tags, which take in our CSS styling. So the Marketing department can just drop it to a location, edit the text/link of the button or edit the text in title, etc.
Looking a bit further, DNN does NOT load jquery automatically. You need to set up your custom skin to load it.
See: https://www.dnnsoftware.com/wiki/client-resource-management-api
The short answer to your question is that you can do all of this using the user control DnnJsInclude. Note that there is also a DnnCssInclude control.
As I understand things (from the referenced item), these load the js and CSS files only if they have not yet been loaded.
If you are looking for a model for a DNN Theme, have a look at nvQuickTheme on GitHub.
Thanks to Will Strohl for pointing me in the right direction ...
The default page separator in DNN is the ">" character. It looks nice but screen readers read it out as "greater than." It's not a deal breaker but it sure gets annoying page after page.
Is it possible to wrap that separator in a span with aria-hidden="true"?
I guess you are talking about the breadcrumb control in the skin file. You can change the separator there using any HTML code, but you have to HTML-encode the value. When you look at the "inner.ascx" file of the Xcillion skin, you find
Separator="<img src="/Portals/_default/Skins/Xcillion/Images/breadcrumb-arrow.png" alt="breadcrumb separator">"
as an example. Therefore, the solution should be
<dnn:BREADCRUMB ID="dnnBreadcrumb" runat="server" CssClass="breadcrumbLink" RootLevel="0" Separator="<span aria-hidden="true"> > </span>" HideWithNoBreadCrumb="true" />
I have a scenario that i will be changing the text element color based on the color which user chooses.
Here is my code.
<i ng-style="{'color':MyObj.Color}" class="icon-Icon_Store_SMS"></i>
<span ng-style="{'color':MyObj.Color}" ng-if="contactNo.length > 0">{{contactNo | telephoneFilter }}</span>
<span ng-style="{'color':MyObj.Color}" ng-if="contactNo.length == 0">{{'8888888888' | telephoneFilter }}</span>
In the above set of statements, i will be changing phone number color to the one which user chooses and the code was working fine in all browsers(IE too) except edge. In Edge browser, color applied for the icon but not for the 2 span elements. When i checked for the cause, i found that removing telephoneFilter code was working fine. TelephoneFilter is angular custom filter which customizes phone number display say something like (123)45678901.
Can anyone guide me how to overcome this issue/any solution
Thanks in advance,
Selva
I am working with Drupal - Seven theme.
I am editing a website that is multilangual: English and Hebrew, I want to add Arabic.
I am facing a problem with the footer menu block:
I add to the English and Hebrew footer menu 'links' for Arabic, exactly the same way English and Hebrew were added (or, exactly the same way English was added to Hebrew).
But I can't see the footer in the Arabic page.
when I look at the Developer Console, I see the following empty content (in contrast to Hebrew and English):
<div id="footer-wrapper">
<div id="footer" class="clearfix">
</div>
</div>
What am I missing? was anything edited manually
I'm working to customize liferay's Calendar portlet and have created a hook for this.
I want to show all the "Related Assets" associated with a Calendar Event directly in the list page itself where all the Events are displayed instead of the Event's detail view page.
Currently liferay shows the "Related Assets" only when we click on the Event to view the details of that Event.
Can anyone help me?
Environment: Liferay 6.1
Thanks a lot
Sabrina
I assume you already have liferay's source code and you know how to create a hook.
The JSPs you would be modifying would be in this path:
portal-web/docroot/html/portlet/calendar
So here are some steps to help you solve your query:
You need to modify the event_iterator.jspf: row.addText(event.getTitle(), rowURL);
You have to adjust the following code taken from view_event.jsp in event_iterator.jspf.
<%
AssetEntry layoutAssetEntry = AssetEntryLocalServiceUtil.getEntry(CalEvent.class.getName(), event.getEventId());
%>
<%-- <liferay-util:buffer> is a tag which stores all that is written inside
its body in a single variable string, in this case "relatedAssetsLinksBuffer"
--%>
<liferay-util:buffer var="relatedAssetsLinksBuffer">
<c:if test="<%= enableRelatedAssets %>">
<%=event.getTitle() %>
<div class="entry-links">
<liferay-ui:asset-links
assetEntryId="<%= layoutAssetEntry.getEntryId() %>"
/>
</div>
</c:if>
</liferay-util:buffer>
Now the line in step-1 becomes: row.addText(relatedAssetsLinksBuffer, rowURL);
I have not tried this but I think it would work or will atleast give you some help in solving your query.
Tip for Hooks (might be useful in future):
Liferay follows a convention in storing its JSPs, so for custom-jsps Hook (i.e. a hook created for modifying liferay's JSP) you just need to search for that particular JSP & modify it.
For Eg: You wanted to modify the first page of calendar portlet. So liferay portlet's first page is always view.jsp located in the folder with the same name as the portlet-name in this case "Calendar" and view.jsp will contain some tags like <%# include /> or <liferay-util:include /> which would include other files to show the content. So you can always start with a view.jsp and navigate ahead. By the way the names of the JSPs are also most of the time self-explanatory.
Hope this helps.