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

Forums / Designing with Sitefinity / Sitetabstrip control

Sitetabstrip control

6 posts, 0 answered
  1. Jay Mehta
    Jay Mehta avatar
    28 posts
    Registered:
    30 Jun 2009
    10 Aug 2009
    Link to this post
    Hi,

    I am planning to use a sitetabstrip control, to display the main navigation of the site. I want to apply a specific image which displays the main nav and flips around for hover or selected style using css.. Can I please get any guidence on this?

    Thank you,
    Jay Mehta.
  2. Radoslav Georgiev
    Radoslav Georgiev avatar
    3370 posts
    Registered:
    01 Feb 2016
    11 Aug 2009
    Link to this post
    Hi Jay Mehta,

    Thank you for using our services.

    The SiteTabStrip control actually uses the Telerik RadTabStrip, so I can suggest that you create a custom skin for the RadTabStrip. In this skin you will define the style rules for the tab strip. You can take a look at the Tutorial: Creating A Custom Skin to see how to build your skin. I will also advise you to take a look at the CSS Skin File Selectors to see exactly which CSS classes you have to modify.

    Now after you have created the tab strip skin, placed in theme folder that your site uses (as instructed in the tutorial), you will have a folder in your theme directory called TabStrip. For example if you are using the Blue with right sidebar theme you will have a directory ~/App_Themes/Blue with right sidebar/TabStrip/ that will hold the CSS and images. The last thing you have to do is to create a RadTabStrip.skin file in the ~/App_Themes/Blue with right sidebar/ directory. This file will tell your theme to use the custom skin for the tab strip, therefore the SiteTabStrip control will use your css. The skin file should look like this:
    <%@ Register TagPrefix="telerik" Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" %> 
    <telerik:RadTabStrip     
        runat="server"  
        Skin="YourSkin" EnableEmbeddedSkins="false"
    </telerik:RadTabStrip> 

    Regards,
    Rado
    the Telerik team

    Instantly find answers to your questions on the newTelerik Support Portal.
    Check out the tipsfor optimizing your support resource searches.
  3. Jay Mehta
    Jay Mehta avatar
    28 posts
    Registered:
    30 Jun 2009
    11 Aug 2009
    Link to this post
    Hi,

    Thank you for your reply. 
    I was going thru the tutorial on creating a custom skin.
    I followed the following steps:
    1) Open Visual Studio 2008
    2) New Website : RadControls VB.net Website
    3) Added a new item: AJAX Web Form
    4) Went to the design mode of the aspx page
    4) Dragged the RadTabStrip control from the tool box

    After this it gives me an error on the control:  Error creating control: Radtabstrip1
                                                                                    Unable to cast object type 'telerik.web.ui.radtabstrip' to type 'telerik.web.ui.controlitemcontainer'

    Can you please guide me on this?

    Thank you,
    Jay Mehta.
  4. Radoslav Georgiev
    Radoslav Georgiev avatar
    3370 posts
    Registered:
    01 Feb 2016
    13 Aug 2009
    Link to this post
    Hi Jay Mehta,

    Thank you for getting back to me.

    The first steps of the tutorial exemplify the creation of the project as to a way to see the changes in your TabStrip. Now you already  gave a project created, this project is your website. i have attached a blank TabStrip skin for you. It has the required structure. All you need to do is to add the files to the theme folder so the theme that you want to use this skin will have it. The name of the skin is TabStrip. After you add it to your project all you have to do is to start building your CSS rules.

    If you have more questions, please feel free to contact us.

    Regards,
    Rado
    the Telerik team

    Instantly find answers to your questions on the newTelerik Support Portal.
    Check out the tipsfor optimizing your support resource searches.
  5. Jay Mehta
    Jay Mehta avatar
    28 posts
    Registered:
    30 Jun 2009
    13 Aug 2009
    Link to this post
    Hi,

    Thanks for the reply.

    Would this same step apply for the RadPanelBar?

    Thank you,
    Jay Mehta.
  6. John
    John avatar
    32 posts
    Registered:
    08 Oct 2008
    13 Aug 2009
    Link to this post
    Hi Jay,

    The same skin steps apply for all of our controls. You set enable embedded skins to false, create a custom skin, drag and drop the CSS onto the page (the CSS is in a theme folder called Green, for example) and add the .skin file with the name. For more info on custom skins, please read this article:

    RadPanelBar Skin

    Generally, the articles are under [Control] Appearance and Styling - Tutorial : Creating a Custom Skin

    -John
Register for webinar
6 posts, 0 answered