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

Forums / Designing with Sitefinity / Styling NewsView Section

Styling NewsView Section

6 posts, 0 answered
  1. Laura Newman
    Laura Newman avatar
    11 posts
    Registered:
    26 Jan 2010
    03 Mar 2010
    Link to this post
    Hello,

    We have added your NewsView section to our site but how do we change the fonts / colours used on this to be our own styles?

    Many thanks,
    Laura
  2. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    09 Dec 2016
    03 Mar 2010
    Link to this post
    Hello Laura Newman,

    The control has CssClass property that is set on a div which wraps NewsView control. You can also edit the public templates and add some css classes to them. You can gather more information at How to apply custom style sheets to Sitefinity Content View controls

    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.
  3. Ricardo Marcelino
    Ricardo Marcelino avatar
    15 posts
    Registered:
    04 Nov 2009
    11 Mar 2010
    Link to this post
    Hello!

    I have edited the templates for ListPageMaster.ascx and .

    I'm trying to create a News List, that already uses ListPageMaster.ascx and ListPageDetails.ascx, that displays the first News element differently from the rest.

    Consider displaying 5 news, in 3 lines. First one has the width of it's container, and the other 2 lines have 2 News each. This last display is easily achieved, my problem is, since we're talking about a <asp:Repeater> having the first one displaying differently. What should i look at? Trying to give the first rendered News a unique ID so i can edit all in .css, giving/checking it out with javascript? Or is there any known way to do it?

    Thanks in advance,
    Ricardo Marcelino
  4. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    09 Dec 2016
    11 Mar 2010
    Link to this post
    Hi Ricardo Marcelino,

    1. You can do it on the server by creating a custom control that inherits from NewsView and override SetItemMetaData method where you can access the first item of the list and apply some style.

    2. You can use jQuery  - first selector

    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.
  5. promedia
    promedia avatar
    4 posts
    Registered:
    16 Aug 2004
    06 Apr 2010
    Link to this post
    Hello Ivan,

    We're using the TIU_v3.7 site as a template. How would you change just the title element of each News Item? I can see that its using this style:

    .sf_newsList h2.sf_newsTitle
    {
     margin: 20px 0;
     padding: 0;
     font-size: 2.2em;
     font-weight: normal;
     line-height: 1.2em;
    }

    How can you access this file to change it? We don't want to set a CSS class to wrap the entire news item, we just want to change one aspect of this file - the news title.

    I've read the files you linked to however when we look inside the  ~\Sitefinity\ControlTemplates\News folder there is no ListPageMaster.ascx or Details.ascx files inside. Where are these files located inside the TIU_v3.7 site?

    Thanks!
  6. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    09 Dec 2016
    06 Apr 2010
    Link to this post
    Hello promedia,

    You could take a look at the KB articles below

    To change the title of each item in the list you have to modify .sf_newsList h2.sf_newsTitle css  classes. Since the title of each item is a link make sure that there is no any "a" element that overrides some of the css properties.
    Best wishes,
    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.
Register for webinar
6 posts, 0 answered