Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Chad Rosenthal 271 posts 473 karma points
    Dec 30, 2009 @ 17:30
    Chad Rosenthal
    0

    Automatically use ImageGen in Content Editor

    I'm looking to have ImageGen automatically used in the Content Editor. All the documentation seemed to point to the XSLT. My problem is that I want the client to upload images to the media folder and then use them by clicking the media icon in the content editor. Basically, I'm going on the assumption that they're not going to resize them and then upload a large image and then try to shrink it using the width and height options in the 'Insert/Edit Media' modal. 

    I was thinking about creating a macro that they could use to select the media and then also to have fields to resize, curve the corners etc.

    Has anyone tried this? Is there a better way to do this?

    Thanks,

    Chad

  • Douglas Robar 3563 posts 4597 karma points MVP 6x admin c-trib
    Dec 30, 2009 @ 17:38
    Douglas Robar
    0

    The macro is the way to go. No direct way to use ImageGen from within the Richtext Editor.

    cheers,
    doug.

  • Evan Jardine 108 posts 168 karma points
    Dec 31, 2009 @ 00:18
    Evan Jardine
    0

    Hi Chad

    I use the macro option with the following xslt.  I only allow the user to pick an image, set the width (so I can constrain the proportions) and alt text.  Hope this helps.

    Cheers
    Evan

     

    <xsl:param name="currentPage"/>

    <xsl:variable name="mediaCurrent" select="/macro/mediaCurrent"/>
    <xsl:variable name="imageWidth" select="/macro/imageWidth"/>
    <xsl:variable name="imageAlt" select="/macro/imageAlt"/>

    <xsl:template match="/">

      <xsl:variable name="imgUrl" select="$mediaCurrent/node/data [@alias='umbracoFile']"/>
        <xsl:if test="$imgUrl != ''">       
            <img>
                <xsl:attribute name="src">
                    <xsl:text>/umbraco/ImageGen.ashx?image=</xsl:text>
                    <xsl:value-of select="$imgUrl"/>   
                    <xsl:text>&amp;constrain=true</xsl:text>
                    <xsl:text>&amp;width=</xsl:text>
                    <xsl:value-of select="$imageWidth"/>
                </xsl:attribute>

                <xsl:attribute name="alt">
                    <xsl:value-of select="$imageAlt"/>
                </xsl:attribute>
            </img>
            </xsl:if>

    </xsl:template>

  • Chad Rosenthal 271 posts 473 karma points
    Dec 31, 2009 @ 17:02
    Chad Rosenthal
    0

    Thanks for the XSLT. I hadn't seen this....so I created my own. A few more parameters. Added height (althought it is still automatically constraining), alignment (although I'd love the macro property to be a dropdown....), and ability to make it a thumbnail with a link to the larger image.

    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE xsl:stylesheet [
      <!ENTITY nbsp "&#x00A0;">
    ]>
    <xsl:stylesheet
        version="1.0"
        xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
        xmlns:msxml="urn:schemas-microsoft-com:xslt"
        xmlns:umbraco.library="urn:umbraco.library" xmlns:Exslt.ExsltCommon="urn:Exslt.ExsltCommon" xmlns:Exslt.ExsltDatesAndTimes="urn:Exslt.ExsltDatesAndTimes" xmlns:Exslt.ExsltMath="urn:Exslt.ExsltMath" xmlns:Exslt.ExsltRegularExpressions="urn:Exslt.ExsltRegularExpressions" xmlns:Exslt.ExsltStrings="urn:Exslt.ExsltStrings" xmlns:Exslt.ExsltSets="urn:Exslt.ExsltSets"
        exclude-result-prefixes="msxml umbraco.library Exslt.ExsltCommon Exslt.ExsltDatesAndTimes Exslt.ExsltMath Exslt.ExsltRegularExpressions Exslt.ExsltStrings Exslt.ExsltSets ">
    
    
      <xsl:output method="xml" omit-xml-declaration="yes"/>
      <xsl:variable name="mediaID" select="/macro/mediaID"/>
      <xsl:variable name="altText" select="/macro/altText"/>
      <xsl:variable name="align" select="/macro/align"/>
      <xsl:variable name="constrain">&amp;contrain=true</xsl:variable>
      <xsl:variable name="makeThumbnail">
        <xsl:choose>
            <xsl:when test="/macro/makeThumbnail != ''">
                <xsl:value-of select="1" />
            </xsl:when>
            <xsl:otherwise>
                <xsl:value-of select="0" />
            </xsl:otherwise>
        </xsl:choose>
      </xsl:variable>
    
      <xsl:variable name="width">
        <xsl:if test="/macro/width != ''">&amp;width=<xsl:value-of select="/macro/width" /></xsl:if>
      </xsl:variable>
      <xsl:variable name="height">
        <xsl:if test="/macro/height != ''">&amp;height=<xsl:value-of select="/macro/height" /></xsl:if>
      </xsl:variable>
    
    
      <xsl:param name="currentPage"/>
    
      <xsl:template match="/">
        <xsl:if test="$mediaID != '' ">
            <xsl:variable name="navigateUrl">/Umbraco/ImageGen.ashx?image=<xsl:value-of select="umbraco.library:GetMedia($mediaID/node/@id, 'false')/data [@alias = 'umbracoFile']" /></xsl:variable>
        <xsl:choose>
    
            <xsl:when test="$makeThumbnail = 1">
                <xsl:element name="a">
                    <xsl:attribute name="href">
                        <xsl:value-of select="$navigateUrl" />
                    </xsl:attribute>
                    <xsl:call-template name="createImage">
                        <xsl:with-param name="imageUrl" select="$navigateUrl" />
                    </xsl:call-template>
                </xsl:element>
    
            </xsl:when>
            <xsl:otherwise>
                <xsl:call-template name="createImage">
                    <xsl:with-param name="imageUrl" select="$navigateUrl" />
                </xsl:call-template>
            </xsl:otherwise>
        </xsl:choose>
        </xsl:if>
        </xsl:template>
    
    
    <xsl:template name="createImage">
        <xsl:param name="imageUrl" />
    
        <xsl:element name="img">
            <xsl:attribute name="src">
                <xsl:value-of select="$imageUrl" /><xsl:value-of select="$width" /><xsl:value-of select="$height" /><xsl:value-of select="$constrain" />
            </xsl:attribute>                  
            <xsl:if test="$align != ''">                      
                <xsl:attribute name="align">                          
                    <xsl:value-of select="$align" />                      
                </xsl:attribute>
            </xsl:if>
                <xsl:attribute name="alt">
                <xsl:choose>
                    <xsl:when test="$altText != ''">
                        <xsl:value-of select="$altText"/>
                    </xsl:when>
                    <xsl:otherwise>
                        <xsl:value-of select="$currentPage/@nodeName"/>
                    </xsl:otherwise>
                </xsl:choose>
            </xsl:attribute>
        </xsl:element>
    </xsl:template>
    </xsl:stylesheet>
  • Chad Rosenthal 271 posts 473 karma points
    Dec 31, 2009 @ 17:09
    Chad Rosenthal
    0
      <xsl:variable name="makeThumbnail">
        <xsl:choose>
            <xsl:when test="/macro/makeThumbnail != ''">
                <xsl:value-of select="/macro/makeThumbnail" />
            </xsl:when>
            <xsl:otherwise>
                <xsl:value-of select="0" />
            </xsl:otherwise>
        </xsl:choose>
      </xsl:variable>d'oh. one small bug - 

     

  • Ashley Andersen 45 posts 88 karma points
    Jul 18, 2013 @ 16:39
    Ashley Andersen
    0

    What is happening if I keep getting a blank URL?

Please Sign in or register to post replies

Write your reply to:

Draft