More in this section

Forums / Developing with Sitefinity / Modify Title for Blog Posts

Modify Title for Blog Posts

10 posts, 1 answered
  1. Randy Bauer
    Randy Bauer avatar
    67 posts
    Registered:
    25 Sep 2009
    03 Nov 2009
    Link to this post
    I want to change the font and color of the Blog Posts Title.  I just watched a webinar called: Designing & Skinning with Sitefinity.  It was a great video on how to do this, but I'm wondering if this is an older version.  I'm not seeing the files they are talking about, including ContentViewItemList.aspx.

    I'm using 3.7.  What do I need to do to make changes to the font color, size, etc, or any other design elements related to the blog module or other modules?

    Thanks in advance,

    Randy
  2. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    12 Sep 2017
    03 Nov 2009
    Link to this post
    Hello Randy Bauer,

    In Sitefinity 3.7 we use embedded templates. There are two possible ways that you can use to achieve this task.

    1. Override the css classes in your theme css.
    2. Map the external templates( external template package is available for downloading from downloads section of your account). Inside the templates there is CssFileLink control which has a reference to the embedded resource. Modify the CssFileLink property to refer your custom css class.

    <telerik:CssFileLink ID="CssFileLink1" FileName="PATH TO YOUR CSS" Media="screen" runat="server" />

    I attached the common layout for PollsBox, EventsView, BlogPosts, Libraries and Newsletters.

    Kind regards,
    Ivan Dimitrov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  3. Randy Bauer
    Randy Bauer avatar
    67 posts
    Registered:
    25 Sep 2009
    03 Nov 2009
    Link to this post

    Ivan,

    How do I override the css class using my css file?

    <h2 class="sf_postTitle">

           <a id="ctl00_MainContent_BlogPosts1_ctl00_repeater_ctl01_fullContent1" href="/schiffhardintest/blog/09-11-03/Boy_dog_tree_logo.aspx">
                        Boy dog tree logo
             </a>

    Thanks,

    Randy
  4. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    12 Sep 2017
    03 Nov 2009
    Link to this post
    Hello Randy Bauer,

    You need to use ! important

    .sf_postTitle
    {
      background-color: Red !important;
    }

    Best wishes,
    Ivan Dimitrov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  5. Randy Bauer
    Randy Bauer avatar
    67 posts
    Registered:
    25 Sep 2009
    03 Nov 2009
    Link to this post
    Ivan,

    Thank you for your help, I am getting closer.  I want to change the color and size of the font to go better with my page design.  This doesn't appear to change the font size, what am I doing wrong.  The Blog Post title is a link.  I want to change the color of the link before and after it is selected.

    .sf_postTitle

    {

     

    font-size: 10px;

     

    }

    Thanks,

    Randy

  6. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    12 Sep 2017
    03 Nov 2009
    Link to this post
    Hi Randy Bauer,

    I do not see the !important element as shown in my previous post. Generally this is a CSS basics.

    Greetings,
    Ivan Dimitrov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  7. Randy Bauer
    Randy Bauer avatar
    67 posts
    Registered:
    25 Sep 2009
    03 Nov 2009
    Link to this post
    Ivan,

    Here is what I have in my css file:

    .sf_postTitle

    {

     

    background-color: Red !important;

     

     

    color: Blue;

     

     

    font-size: 30px;

     

    }



    I've include a screen shot for your review.  I don't want to change the background color.  I want to change the font color and the font size.  Do I need to change a different property for the link?

    Thanks,

    Randy
  8. Randy Bauer
    Randy Bauer avatar
    67 posts
    Registered:
    25 Sep 2009
    03 Nov 2009
    Link to this post
    OK, I figured it out.  I had to change the properties for the link.  Is it possible to change the link for just the blog page and not the entire site?  Setting the A:link, A:hover, ect changed it for the entire website.

    I'm also looking for the documentation on the external templates.

    Thanks for your help,

    Randy
  9. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    12 Sep 2017
    03 Nov 2009
    Link to this post
    Hi Randy Bauer,

    Take a look at the following blog post about how to map the Presentation mode templates. Then follow my suggestion from the first post( way 2)

    Kind regards,
    Ivan Dimitrov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
    Answered
  10. Randy Bauer
    Randy Bauer avatar
    67 posts
    Registered:
    25 Sep 2009
    03 Nov 2009
    Link to this post
    Thanks for all your help Ivan.

    Randy
Register for webinar
10 posts, 1 answered