none
Style separate webparts with css and jquery SharePoint 2013

    Question

  • Hi, I found this blog post on http://blog.creative-sharepoint.com/2013/06/5-features-for-your-sharepoint-2013-intranet-homepage/#more-2798

    There the content Author har styled separate webparts like the newsfeed and so on. I am under the impression that it is not good practice to use the CEWP to style pages in a prod. environment. I also have experienced css getting "cleaned up" when saving.

    I see several People refer to using jquery to point to a spesific wepbart, but i am unsure of how to do this. I am using SPDesigner 2013 and SP Ent. 2013. I have searched the web, but not found any really good links/tuts on this.

    If someone could give me an example of how to achieve the effect on the newsfeed header through the use of jquery, I would be very Grateful.

    Friday, August 22, 2014 10:40 AM

Answers

  • Hi,

    We can use CSS style to achieve it. Please add the following code into the Content Editor Web Part in the page.

    <style type="text/css">
        #ms-microfeeddiv #ms-titlebararea{
            background-color:#00ff90;
        }
        #ms-microfeeddiv #ms-titlebararea h2 a{
            color: #fff;
            font-family:"Segoe UI Semibold","Segoe UI",Sans-Serif;
        }
    </style>

    Best Regards


    Dennis Guo
    TechNet Community Support

    Monday, August 25, 2014 12:19 PM
    Moderator

All replies

  • Hi, I found this blog post on http://blog.creative-sharepoint.com/2013/06/5-features-for-your-sharepoint-2013-intranet-homepage/#more-2798

    There the content Author har styled separate webparts like the newsfeed and so on. I am under the impression that it is not good practice to use the CEWP to style pages in a prod. environment. I also have experienced css getting "cleaned up" when saving.

    I see several People refer to using jquery to point to a spesific wepbart, but i am unsure of how to do this. I am using SPDesigner 2013 and SP Ent. 2013. I have searched the web, but not found any really good links/tuts on this.

    If someone could give me an example of how to achieve the effect on the newsfeed header through the use of jquery, I would be very Grateful.


    Anyone?
    Saturday, August 23, 2014 10:28 AM
  • Hi,

    We can use CSS style to achieve it. Please add the following code into the Content Editor Web Part in the page.

    <style type="text/css">
        #ms-microfeeddiv #ms-titlebararea{
            background-color:#00ff90;
        }
        #ms-microfeeddiv #ms-titlebararea h2 a{
            color: #fff;
            font-family:"Segoe UI Semibold","Segoe UI",Sans-Serif;
        }
    </style>

    Best Regards


    Dennis Guo
    TechNet Community Support

    Monday, August 25, 2014 12:19 PM
    Moderator