+1-888-365-2779
Try Now
More in this section

Forums / Developing with Sitefinity / Link to different language version of page

Link to different language version of page

24 posts, 0 answered
  1. Mikael Kleinwort
    Mikael Kleinwort avatar
    78 posts
    Registered:
    17 May 2004
    21 Dec 2008
    Link to this post
    Rather than a dropdown for language selection on the content page, I would like to have a list of links. How can I accomplish this? (for instance, through code in the master page).

    Thank you in advance for your input,

    Regards, MIkael
  2. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    22 Dec 2008
    Link to this post
    Hi Mikael Kleinwort,

    Here is an example that will represent the language drop down as a list of links. You could style the links using css.

    Steps:

    Create a class in App_Code folder in which you inherit LangugeList

    using System; 
    using System.Collections.Generic; 
    using System.Web.UI; 
    using System.Web.UI.WebControls; 
    using Telerik.Localization.WebControls; 
     
    namespace MyControls 
        /// <summary> 
        /// This class inherits from LanguageList to extend 
        /// </summary> 
        public class CutomLanguageList : LanguageList 
        { 
            public CutomLanguageList() 
            { 
                // 
                // TODO: Add constructor logic here 
                // 
            } 
        } 

    Then you could create a user control where you have LanguageBar control and tell the LanguageBar to use a custom template.

    <%@ Control Language="C#" AutoEventWireup="true" CodeFile="customLanguageList.ascx.cs" Inherits="CustomControls_customLanguageList" %> 
    <%@ Register Assembly="Telerik.Localization" Namespace="Telerik.Localization.WebControls" TagPrefix="lng" %> 
     
    <style type="text/css"
    .langList li 
        float:left; 
        padding: 5px; 
        list-style-type:none; 
    </style> 
     
    <lng:LanguageBar ID="List1" runat="server"
    </lng:LanguageBar> 

    code behind.

    using System; 
    using System.Collections.Generic; 
    using System.Web; 
    using System.Web.UI; 
    using System.Web.UI.WebControls; 
    using MyControls; 
     
    public partial class CustomControls_customLanguageList : System.Web.UI.UserControl 
        protected void Page_Load(object sender, EventArgs e) 
        { 
            // tell the LanguageBar to use a custom template 
            this.List1.LayoutTemplate = new DefaultTemplate(); 
        } 
     
         
         private class DefaultTemplate : ITemplate 
          { 
              public void InstantiateIn(Control container) 
              { 
                  // initialize the LanguageBarList 
                  CutomLanguageList list = new CutomLanguageList(); 
                  // set the ID so that it is recognized by the container 
                  list.ID = "languageList"
                  list.CssClass = "langList"
                  
                  container.Controls.Add(list); 
              } 
          } 

    Regards,
    Ivan Dimitrov
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  3. Mikael Kleinwort
    Mikael Kleinwort avatar
    78 posts
    Registered:
    17 May 2004
    10 Jan 2009
    Link to this post
    Hello Ivan,

    thanks a lot. Works great!

    One detail: the control automatically renders an inline style attribute

    style="font-weight:bold;font-style:italic;"

    with the <li> element of the current language. How can I prevent this?

    regards, Mikael
  4. Mikael Kleinwort
    Mikael Kleinwort avatar
    78 posts
    Registered:
    17 May 2004
    10 Jan 2009
    Link to this post
    ActuallyI have a second question:

    how can I modify each rendered <li> element in code-behind, for instance o specifry my own cssclasses depending on certain criteria?

    I am not familiar with programming templated controls, so your input is highly appreciated.

    Regards, Mikael
  5. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    12 Jan 2009
    Link to this post
    Hi Mikael Kleinwort,

    You could specify the classes in the ascx file or use sfWeb:CssFileLink control which we discussed in another thread. As for the templated control you can gather more information form this MSDN article

    I hope this helps.

    Best wishes,
    Ivan Dimitrov
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  6. Mikael Kleinwort
    Mikael Kleinwort avatar
    78 posts
    Registered:
    17 May 2004
    21 Feb 2009
    Link to this post
    Hi Ivan,

    I am not clear on this yet. My problem: the SF custom language list does render a style attribute with the link of the currently active language, and there seems to be no way to preven tthis. The style attribute overwrites my css formatting, of course.

    Here is my ascx file:

    <%

    @ Control Language="C#" AutoEventWireup="true" CodeFile="customLanguageList.ascx.cs" Inherits="CustomControls_customLanguageList" %>

     

    <%

    @ Register Assembly="Telerik.Localization" Namespace="Telerik.Localization.WebControls" TagPrefix="lng" %>

     

     

    <

     

    lng:LanguageBar ID="List1" runat="server">

     

    </

     

    lng:LanguageBar>

    And this is the code behind:

     

    public

     

    partial class CustomControls_customLanguageList : System.Web.UI.UserControl

     

     

     

     

    {

     

    protected void Page_Load(object sender, EventArgs e)

     

    {

     

    // tell the LanguageBar to use a custom template

     

     

     

     

     

    this.List1.LayoutTemplate = new DefaultTemplate();

     

    }

     

     

    private class DefaultTemplate : ITemplate

     

     

     

     

    {

     

    public void InstantiateIn(Control container)

     

    {

     

    // initialize the LanguageBarList

     

     

     

     

     

    CustomLanguageList list = new CustomLanguageList();

     

     

    // set the ID so that it is recognized by the container

     

     

     

     

    list.ID =

    "languageList";

     

    list.CssClass =

    "langList";

     

    container.Controls.Add(list);

    }

    }

    }

     


    And this is what I get rendered, see the problematic style attribute highlighted in bold. This is when the page is displayed in english - the english language link gets the style attribute attached to it:

    <ul id="ctl00_ctl00_languageNavigation_ctl00_List1_ctl00_languageList" class="langList" class="langList">
    <li><a id="ctl00_ctl00_languageNavigation_ctl00_List1_ctl00_ctl01_listItem" href="javascript:languageBars['ctl00_ctl00_languageNavigation_ctl00_List1_ctl00_languageList'].Submit('de');">Deutsch</a></li><li><a id="ctl00_ctl00_languageNavigation_ctl00_List1_ctl00_ctl03_listItem" href="javascript:languageBars['ctl00_ctl00_languageNavigation_ctl00_List1_ctl00_languageList'].Submit('en');" style="font-weight:bold;font-style:italic;">English</a></li>

    </ul>

    How can I prevent this style attribute from being rendered? It messes with my formatting. It shouldn't be there...

    regards, Mikael


  7. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    23 Feb 2009
    Link to this post
    Hi Mikael Kleinwort,

    What have you set for langList CssClass. Generally editing this class you can modify how the list is styled.
    Sincerely yours,
    Ivan Dimitrov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  8. Mikael Kleinwort
    Mikael Kleinwort avatar
    78 posts
    Registered:
    17 May 2004
    05 Apr 2009
    Link to this post
    Hello Ivan,

    about the css styling of the rendered link in the custom language list. There are 2 problems.

    First problem - inline styles from SiteFinity code:

    To answer your question: yes I am applying css to the list, I can see the applied class in the page html, and the css is working.

    However, although I do apply a css class, your code still does render inline styles to the inactive link.

    style="font-weight:bold;font-style:italic;">

    This messes things up quite a bit. I have to apply a counter style

     

    langList li a { font-weight: normal !important;}

     

    and it works, but now I have no way to apply font-weight: bold to the active link.

    Second problem - cannot style active link

    I find no way to style the active and inaxctive links of the language list through css. It seems that because the <a> tags are rendered with javascript hrefs, pseudo styles a:active do not work. So I need a way to apply different css classes to active and inactive links of the list, either through properties of the SiteFinity languageList control or through code-behind.

    Could you please tell me how to accomplish this. This is very important for me. I would appreciate a quick answer since the site is supposed to go live tomorrow. Thank you.
  9. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    07 Apr 2009
    Link to this post
    Hello Mikael Kleinwort,

    The problem is that  bold and italic properties of the control are hardcoded in a private class that cannot be accessed. Thus, inline style is applied. Due to this reasons you are not able to style the control as you want. I have added this problem for fixing - we will make the class public, so that it can be overridden and we will ad item.CssClass property.

    Greetings,
    Ivan Dimitrov
    the Telerik team

    Check out Telerik Trainer , the state of the art learning tool for Telerik products.
  10. Mikael Kleinwort
    Mikael Kleinwort avatar
    78 posts
    Registered:
    17 May 2004
    07 Apr 2009
    Link to this post
    Hello Ivan,

    may I suggest that in addition to making the class public, you properly fix the behavior of the control: if the language list has a css class applied, it should not add its own inline style. It is a kind of very strange that I would need to overwrite a controls class to be able to apply standard css.

    Thanks anyway!
    Mikael
  11. Mikael Kleinwort
    Mikael Kleinwort avatar
    78 posts
    Registered:
    17 May 2004
    07 Apr 2009
    Link to this post
    Addition:
    what's actually missing is that the control renders a class="selected" cass attribute so we can style the links through standard css.

    Since the control renders javascript href tags there I find no way, not even thorugh my own javascript on the page, to style the language links differently depending on whether its the active language or not.

    See my separate suggestion ticket about this.

    Is there any hope that tjere will be a way to work around this in SP1? I can't style our site the way we need it right now.

    Regards!
    Mikael
  12. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    07 Apr 2009
    Link to this post
    Hello Mikael Kleinwort,

    Thank you for your feedback.

    Here are the answers to some of your questions.

    may I suggest that in addition to making the class public, you properly fix the behavior of the control: if the language list has a css class applied, it should not add its own inline style. It is a kind of very strange that I would need to overwrite a controls class to be able to apply standard css.

    " .....- we will make the class public,...."

    Is there any hope that tjere will be a way to work around this in SP1? I can't style our site the way we need it right now.

    We are on the last step of release and I cannot give you a certain reply whether we will be able to sort out the issue for the SP.

    Best wishes,
    Ivan Dimitrov
    the Telerik team

    Check out Telerik Trainer , the state of the art learning tool for Telerik products.
  13. Tys
    Tys avatar
    15 posts
    Registered:
    17 Feb 2009
    22 Feb 2010
    Link to this post
    I've used this piece of code and it works perfect. Only i'm looking for a way to make the items render as short language codes. Like "EN" instead of "english". Does anyone have a good idea about how to do this?

    Greets, Tys 
  14. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    22 Feb 2010
    Link to this post
    Hello Tys,

    You can access each ListItem from the list and change the text of the item. You can achieve the same functionality adding the control declaratively.

    <style type="text/css">  
    .langList li  
    {  
        float:left;  
        padding: 0px;  
        list-style-type:none; 
            
        
    </style
       
    <lng:LanguageBar  ID="list1" runat="server"
        <LayoutTemplate
            <lng:LanguageList CssClass="langList" ID="languageList" runat="server"></lng:LanguageList
        </LayoutTemplate
    </lng:LanguageBar>



    sample

    foreach (ListItem item in LangListControl.Items)
    {
        if (item.Text == "english")
        {
            string newText = "EN";
            item.Text = newText;
        }
    }


    Sincerely yours,
    Ivan Dimitrov
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  15. Tys
    Tys avatar
    15 posts
    Registered:
    17 Feb 2009
    23 Feb 2010
    Link to this post
    Hi Ivan,
    Thanks for your reply. The first option worked well. Thats enough to finish my project. 
    But i tried it the declarative way and then the collection seemed empty. 
    Regards, Tys 
  16. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    23 Feb 2010
    Link to this post
    Hi Tys,

    Try using this code to get the ListItems

        protected override void OnPreRender(EventArgs e)
        {
            base.OnPreRender(e);
            ControlCollection c = list1.Controls;
     
            LanguageList lngList = this.FindControlRecursive(list1, "languageList") as LanguageList;
            foreach (ListItem lItem in lngList.Items)
            {
                string itemTxt = lItem.Text;
            }
         }
     
    private Control FindControlRecursive(Control root, string id)
        {
            if (root.ID == id)
            {
                return root;
            }
     
            foreach (Control c in root.Controls)
            {
                Control t = FindControlRecursive(c, id);
                if (t != null)
                {
                    return t;
                }
            }
     
            return null;
        }
         


    Kind regards,
    Ivan Dimitrov
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  17. Imran
    Imran avatar
    75 posts
    Registered:
    17 Jan 2007
    26 May 2011
    Link to this post
    Hi

    I used this control and it seems to reload the page in the correct language that I clicked.

    But when I navigate to another page, the language changes back to the default language.

    In web.config settings are:

    <localization defaultProvider="Sitefinity" persistenceMode="QueryString" defaultCulture="en" cultures="en, fr">
          <providers>
            <clear />
            <add name="Sitefinity" type="Telerik.Localization.Data.DefaultProvider, Telerik.Localization.Data" connectionStringName="DefaultConnection" />
          </providers>
        </localization>

    How do I go about persisting the language on the other pages ?

    - Thanks
  18. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    27 May 2011
    Link to this post
    Hello Imran,

    The language is set depending on the QuerySting value -QueryString. If there is no page on this language we redirect to the default culture. Can you verify that the key is correct and you have this page in both the languages?

    Best wishes,
    Ivan Dimitrov
    the Telerik team
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  19. Imran
    Imran avatar
    75 posts
    Registered:
    17 Jan 2007
    27 May 2011
    Link to this post
    Hi Ivan - thanks for your reply.. 

    I can confirm that when I toggle the language code in the querystring it does change the language of the page.

    However, when I hover over a link, in the bottom browser status bar I can see that the links do not have the langugage querystring variable "sflang". So by this I assume that we you click it, it goes to a page without a language and therefore loads the default language.

    Is there a resolution for this ?

  20. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    30 May 2011
    Link to this post
    Hello Imran,

    Can you tell me which link you hover. Is this a link generated by the code above, navigation link or random link from your page?

    Best wishes,
    Ivan Dimitrov
    the Telerik team
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  21. Imran
    Imran avatar
    75 posts
    Registered:
    17 Jan 2007
    31 May 2011
    Link to this post
    Hi Ivan

    I have a user control on the page, and the links are hard-coded to pages of the site. i.e

    <asp:HyperLink runat="server" ID="TestLink" NavigateUrl="~/directory/somepage.aspx">Click Here </a>

    I guess this explains the problem. Is there anything I can do to make links in controls point to the correct language - a way to localize them ?

    In addition, if there are links in the Generic Content editor, and the links were NOT created using the link manager, and hard-coded to a page, is there a way to point them to the correct language without re-doing them ?

    Thanks
  22. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    01 Jun 2011
    Link to this post
    Hello Imran,

    If the links are static and hardcoded it is not possible to resolve them automatically. You need to create a  custom controls where you use static links and resolve them based on a logic that detects whether there is a localized version of this page.

    Best wishes,
    Ivan Dimitrov
    the Telerik team
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  23. Imran
    Imran avatar
    75 posts
    Registered:
    17 Jan 2007
    06 Jun 2011
    Link to this post
    Ivan

    Thanks for your reply. I will have to look into what is the best way to tackle this given the current project.

    Just another small thing.. The code here: 

    http://www.sitefinity.com/devnet/forums/sitefinity-3-x/developing-with-sitefinity/link-to-different-language-version-of-page.aspx#706499

    When you have an action that causes postback, the list turns into a drop down list. Is there a way to stop this happening?

    Ultimately I would prefer to write my own control to switch the language, so I could have full control. Am I correct in assuming that it goes the following:

    1) It sets the querystring, or changes the DominaName based on the Localization setting
    2) Sets localization culture

    On our local dev machines, we work with QueryString localization setting, but the production server is DomainName based, so I would like to write a control that can handle both scenarios. 
  24. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    08 Jun 2011
    Link to this post
    Hello Imran,

    You can use the code provided in this thread to fix the issue with the reverting the list to drop down. The problem with the code from the other post is that the ITemplate should be set inside OnPreRender.

    Generally you don't need to care for the PathPrefix that is used for the localization if you get/set the CurrentCulture. Another option is exposing a public property that you will use to set the way that the control will handle the culture - QueryString or DomainName.
    Just a suggestion, it is better to use the same dev/staging and production environments with the same settings so that you will eliminate the way for some changes when you move the website to production. It is also better if you can ensure the same infrastructure.

    All the best,
    Ivan Dimitrov
    the Telerik team
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
Register for webinar
24 posts, 0 answered