Change Ratings.png file SPOnline/Office365

There are at least 2 ways available for achieving this:

1. You could do this in JQuery
2. You could make a change in SP Designer by making change in the SiteOptions. In the SiteOptions, there is a property Ratings [ratings_imagestripurl], you can update this value. The only catch here is the APP pool has to be restarted.

Change Ratings for Blue to Golden - SP Online Office365

How do you change the ratings from blue to control on the RatingsControl that is rendered.

In SP Online, you have lot of limitations and your best friend is JQuery. There are several ways in which this can be accomplished. A simple way is to swap the class that is used when the ratings control is rendered on the page. Here is how the command will look.

$(".ms-rating_1").addClass("ms-rating_1_new").removeClass("ms-rating_1");

The only issue with this is that there is no matching class when the average rating is 1.5, 2.5...and so forth. In that scenario, you would have to create a new mirror opposite of the rating image and load it to your images folder.




This is an example of that type of code. In this, we would add a class and remove the existing class and then replace the image.

    //$(".ms-rating_4_5").addClass("ms-rating_4_5_new").removeClass("ms-rating_4_5").attr("src", "/sites/ynn/siteAssets/images/Ratings/ratingsEmptyCustom.png")

Alternatively, if you can live without averages rounded to .5 then you can simply do this:

$(".ms-rating_1_5").addClass("ms-rating_2_new").removeClass("ms-rating_1_5");

CQWP - Display content from 3rd(N) Position Onwards

Here are the steps:

• Open ItemStyle.XSLT file
• Simply create your own template by copying an existing template.
• Insert the bold variable.
• Add an "If" condition where the content is rendered.

Using this technique, you can get data from any position onwards.

<xsl:template name="Display2NDRowOnwards" match="Row[@Style='ImageTopCentered']" mode="itemstyle">
        <xsl:variable name="SafeLinkUrl">
            <xsl:call-template name="OuterTemplate.GetSafeLink">
                <xsl:with-param name="UrlColumnName" select="'LinkUrl'"/>
            </xsl:call-template>
        </xsl:variable>
        <xsl:variable name="SafeImageUrl">
            <xsl:call-template name="OuterTemplate.GetSafeStaticUrl">
                <xsl:with-param name="UrlColumnName" select="'ImageUrl'"/>
            </xsl:call-template>
        </xsl:variable>
        <xsl:variable name="DisplayTitle">
            <xsl:call-template name="OuterTemplate.GetTitle">
                <xsl:with-param name="Title" select="@Title"/>
                <xsl:with-param name="UrlColumnName" select="'LinkUrl'"/>
            </xsl:call-template>
        </xsl:variable>
        <xsl:variable name="ItemNumber">
             <xsl:number  format="1"></xsl:number>
        </xsl:variable>
        <div class="item centered4">
            <xsl:if test="string-length($SafeImageUrl) != 0">
                <div class="image-area-top">
                    <a href="{$SafeLinkUrl}" >
                      <xsl:if test="$ItemsHaveStreams = 'True'">
                        <xsl:attribute name="onclick">
                          <xsl:value-of select="@OnClickForWebRendering"/>
                        </xsl:attribute>
                      </xsl:if>
                      <xsl:if test="$ItemsHaveStreams != 'True' and @OpenInNewWindow = 'True'">
                        <xsl:attribute name="onclick">
                          <xsl:value-of disable-output-escaping="yes" select="$OnClickTargetAttribute"/>
                        </xsl:attribute>
                      </xsl:if>
                      <img class="image" src="{$SafeImageUrl}" title="{@ImageUrlAltText}">
                        <xsl:if test="$ImageWidth != ''">
                          <xsl:attribute name="width">
                            <xsl:value-of select="$ImageWidth" />
                          </xsl:attribute>
                        </xsl:if>
                        <xsl:if test="$ImageHeight != ''">
                          <xsl:attribute name="height">
                            <xsl:value-of select="$ImageHeight" />
                          </xsl:attribute>
                        </xsl:if>
                      </img>
                    </a>
                </div>
            </xsl:if>
            <div class="link-item">
                <xsl:call-template name="OuterTemplate.CallPresenceStatusIconTemplate"/>
                <a href="{$SafeLinkUrl}" title="{@LinkToolTip}">
                  <xsl:if test="$ItemsHaveStreams = 'True'">
                    <xsl:attribute name="onclick">
                      <xsl:value-of select="@OnClickForWebRendering"/>
                    </xsl:attribute>
                  </xsl:if>
                  <xsl:if test="$ItemsHaveStreams != 'True' and @OpenInNewWindow = 'True'">
                    <xsl:attribute name="onclick">
                      <xsl:value-of disable-output-escaping="yes" select="$OnClickTargetAttribute"/>
                    </xsl:attribute>
                  </xsl:if>
               
                    <xsl:if test="$ItemNumber > 2">
                          <xsl:value-of select="$ItemNumber" />
                          <xsl:value-of select="$DisplayTitle"/>
                      </xsl:if>

                </a>
                <div class="description">
                    <xsl:value-of select="@Description" />
                </div>
            </div>
        </div>
    </xsl:template>