I can see on the Flowplayer site how to customize using CSS, but when flowplayer is used within Umbraco razor or xslt I am not sure how to get the css to target the parts of flowplayer. Any help would be appreciated. Thanks!
The styling etc. should be possible to keep outside the XSLT file so you just style the outputted HTML as you normally would do if it was a static HTML template.
But try to ellaborate a bit more on what you want to achieve and let's see what we can do about it :)
I was trying to make the flowplayer colors match our website better. The default style uses colors that don't go with our scheme and I would like to change those at least. I don't know how I would target the areas of the player using css, as all the documentation shows flowplayer set up as HTML 5 with this:
How can you customize Flowplayer?
I can see on the Flowplayer site how to customize using CSS, but when flowplayer is used within Umbraco razor or xslt I am not sure how to get the css to target the parts of flowplayer. Any help would be appreciated. Thanks!
Right now I am using this xslt for flowplayer
<xsl:param name="currentPage"/> <xsl:variable name="videonode" select="/macro/videoNode"/> <xsl:variable name="videoid" select="generate-id($videonode)"/> <xsl:variable name="videopath" select="$videonode/File/umbracoFile"/> <xsl:variable name="videoheight" select="/macro/VideoHeight"/> <xsl:variable name="videowidth" select="/macro/VideoWidth"/> <xsl:template match="/"> <script type="text/javascript" src="/scripts/flowplayer-3.1.4.min.js"></script> <a class="videoid"> <div class="video"> <xsl:attribute name="href"> <xsl:value-of select="$videopath" /> </xsl:attribute> <xsl:attribute name="style"> <xsl:text>display:block;height:</xsl:text><xsl:value-of select="$videoheight"/><xsl:text>px;width:</xsl:text><xsl:value-of select="$videowidth"/><xsl:text>px</xsl:text> </xsl:attribute> <xsl:attribute name="id"> <xsl:value-of select="$videoid" /> </xsl:attribute> </div> </a> <script type="text/javascript"> <![CDATA[ var videoid = "]]><xsl:value-of select="$videoid" /><![CDATA["; flowplayer(videoid, "/scripts/flowplayer-3.1.4.swf"); ]]> </script> </xsl:template>Hi Steve
What sort of customization are you trying to do?
The styling etc. should be possible to keep outside the XSLT file so you just style the outputted HTML as you normally would do if it was a static HTML template.
But try to ellaborate a bit more on what you want to achieve and let's see what we can do about it :)
/Jan
Jan,
I was trying to make the flowplayer colors match our website better. The default style uses colors that don't go with our scheme and I would like to change those at least. I don't know how I would target the areas of the player using css, as all the documentation shows flowplayer set up as HTML 5 with this:
<div class="flowplayer">
<video>
<script></script>
</video>
</div>
Bump... Any Ideas on how I can change the color of the player controls?
is working on a reply...