Forums

Skip Navigation LinksHome / Developer Network / Forums / Sitefinity 3.x: Developing with Sitefinity > Description + Images Module Question

Description + Images Module Question

  • medicalwebgeek Intermediate avatar

    Posted on Apr 3, 2008 (permalink)

    How can I add descriptions of my photos to the image gallery module?

    Reply

  • Rebecca Rebecca admin's avatar

    Posted on Apr 4, 2008 (permalink)

    Hello medicalwebgeek,

    By default you are able to add Description to items from libraries of type Custom and Document. However, this option is not available for the Image library items. Adding a description to images is a pretty easy task and can be achieved in three steps:

    1. Add the Description meta field for the Image library type. The needed meta field is already declared in the database and set to be used for the Custom and Document library types. This is why, you only need to set it to for the Image library type in the application web.config like this:

    <libraries defaultGenericProvider="Libraries">  
     ...  
        <libraryInfo>  
            <add name="Image" title="Image Library" defaultExtenstions=".png, .jpg, .jpeg, .gif" metaKeys="Description, Author, AlternateText, Extension, Name, Height, Width, Size, Category"></add>  
            <add name="Document" title="Document Library" defaultExtenstions=".doc, .docx, .rtf, .txt, .pdf, .ppt, .pptx, .html, .xls, .xlsx" metaKeys="Author, Description, Extension, Name, Size, Category"></add>  
            <add name="Custom" title="Custom Library" defaultExtenstions=".*" metaKeys="Author, Description, Extension, Name, Size, Category"></add>  
        </libraryInfo>  
    </libraries>  
     

    2. Add a TextBox control inside the images edit template ~/Sitefinity/Admin/ControlTemplates/Libraries/ControlPanelEdit_Image.ascx. You should add a TextBox with ID equal to the name of the meta field, that is, “Description”. Be careful to add this control inside the ContentMetaFields control:

    <sfGCn:ContentMetaFields ID="editMetaFields" runat="server">  
     <ItemTemplate>  
      ...  
      <li>  
       <asp:Label ID="Label5" runat="server" AssociatedControlID="Description" Text="Description: "></asp:Label>  
       <asp:TextBox runat="server" ID="Description" TextMode="MultiLine"></asp:TextBox>  
      </li>  
      ...  
     </ItemTemplate>  
    </sfGCn:ContentMetaFields> 

    3. Add a Label in the public template. In order to show the description in the public part, you should open the template which is used by the ImageGallery control. For example, if the control is set to show the images with List & Page mode, you should modify the ~/Sitefinity/ControlTemplates/Libraries/GalleryListViewTemplate.ascx template by adding an ITextControl field with “Description” ID.

    Kind regards,

    Rebecca
    the Telerik team


    Instantly find answers to your questions at the new Telerik Support Center

    Reply

  • Sam avatar

    Posted on May 29, 2008 (permalink)

    This is great.
    I'm curious, is there a way to specify a data type other than "ShortText" for the new Description field?
    If entering text longer than 250 characters, I receive this error:
    "Value for property ShortText is too long. Maximun length is 250"

    While I can put a MaxLength limiter on the TexBox, I'd rather have longer descriptions.
    Any ideas?

    Reply

  • Nigel avatar

    Posted on May 30, 2008 (permalink)

    Well, you could always try "LongText". ;)

    Reply

  • Sam avatar

    Posted on May 30, 2008 (permalink)

    And where exactly would I specify that? 
    I wish it were so apparently simple.
    As best as I can tell from the post, the inclusion of the "Description" field is done in the web.config, with no apparent options for specification of DataType.
    While I've cracked the DB itself and see where the datatype is specified, I do not want to hack it there for fear of later overwrite.

    I've included RequireField and RegularExpressionFields on the Single Item and Batch Edit .ascx files as a stop gap.

    Reply

  • Slavo Slavo admin's avatar

    Posted on May 30, 2008 (permalink)

    Hi Sam,

    It is actually quite easy to achieve what you want and I guess your confusion comes from the fact that you are only looking at the libraryInfo section of the web.config.
    As you may know, the Libraries module is based on Generic Content, so it inherits a lot of functionality directly. We've tried to take out common features and behavior in the Generic Content module so that any other derived modules can benefit from that functionality. Metafields are an example. This is why when you add additional metafields in the web.config, you should do it in <cmsEngine>/<metaFields> section. Then in <libraryInfo>, you only specify which metafields are used by which library type. You may notice that the Description metafield is already present and this is why Rebecca didn't include instructions on how to add it. Here:

    <cmsEngine defaultProvider="Generic_Content"
          ... 
          <metaFields> 
            <add key="Libraries.Name" valueType="ShortText" visible="True" searchable="True" sortable="True" defaultValue="" /> 
            <add key="Libraries.Width" valueType="Integer" visible="True" searchable="True" sortable="True" defaultValue="" /> 
            ... 
            <add key="Libraries.Description" valueType="ShortText" visible="True" searchable="True" sortable="True" defaultValue="" /> 
            ... 
          </metaFields> 
    </cmsEngine> 

    Possible values for the valueType attribute are: ShortText, LongText, DateTime, Integer, FloatingPoint, Boolean, Guid, Binary. I hope things are a little clearer now. If not, we'll be happy to help further.

    Regards,
    Slavo
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center

    Reply

  • Sam avatar

    Posted on May 30, 2008 (permalink)

    Thank you to Slavo and Nigel!
    That was the missing pearl of wisdom that I was looking forward.

    Reply

  • Szymon avatar

    Posted on Jun 14, 2008 (permalink)

    Hi,

    Thanks for this very detailed information. I was able to add the field to image properties in the design mode. However I can't figure out how to add it to the Lightbox template. Basically I want to put description next to title when image is displayed in full size.

    Thanks,
    -Szymon

    Reply

  • Georgi Georgi admin's avatar

    Posted on Jun 16, 2008 (permalink)

    Hello Szymon,

    You can change the Lightbox javascript so it can show additional text, when showing the image. For example, if you wish to show the picture's ALT text information, here's the change you should do in lightbox.js, located in \[YourProject]\Sitefinity\ExternalLibraries\lightbox\js:

    1. Find:

    for (var i=0; i<anchors.length; i++){ 
        var anchor = anchors[i]; 
        if (anchor.getAttribute('href') && (anchor.getAttribute('rel') == imageLink.getAttribute('rel'))){ 
        imageArray.push(new Array(imageLink.getAttribute('href'), imageLink.getAttribute('title')));     
     } 

    and change it to:

    for (var i=0; i<anchors.length; i++){ 
        var anchor = anchors[i]; 
        if (anchor.getAttribute('href') && (anchor.getAttribute('rel') == imageLink.getAttribute('rel'))){ 
        imageArray.push(new Array(anchor.getAttribute('href'), anchor.getAttribute('title')+'<br/>'+imageLink.firstChild.getAttribute('alt'))) 
        } 

    The additional code is looking for the image's ALT text and adds it to the text that must be shown in the Lightbox.
    To achieve your goal, you should add the Description meta field in the GalleryLightboxListTemplate.ascx, located in \[YourProject]\Sitefinity\ControlTemplates\Libraries, using this code:

    <asp:Literal ID="Description" runat="server" /> 

    Then you have to modify the JavaScript so it can take the description text instead of the alt text. This code will be different and will depend on the exact location where you insert the meta field tag (asp:Literal ID="Description"). I suggest you try with the ALT tag first and then decide where to insert the description meta tag.
    Please back up any files you are going to modify, so you can restore them later if anything goes wrong.

    Regards,
    Georgi
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center

    Reply

  • medicalwebgeek Intermediate avatar

    Posted on Jul 1, 2008 (permalink)

    I am using my Alt for my title rather than description.

    When I click on my image from the image list, it shows the alt as my title which is great.  My problem is if I click the Next or Previous button it shows the same alt tag for my title rather than the alt tag associated with the particular image.

    Please advise.

    Reply

  • Georgi Georgi admin's avatar

    Posted on Jul 7, 2008 (permalink)

    Hello medicalwebgeek,

    Please, accept my apologies. I haven't tested the Next/Previous buttons.

    Attached is the modified 091826_lightbox.zip. Please, review the changes. Now the ALT property should be taken (and updated) every time you click on Next/Prev link and when you click on the image itself.

    I hope that works. Let me know if more assistance is needed.

    Greetings,
    Georgi
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center

    Reply

  • Roman avatar

    Posted on Apr 24, 2009 (permalink)

    imageArray.push(new Array(anchor.getAttribute('href'), anchor.getAttribute('title'), anchor.parentNode.getElementsByTagName('img')[0].alt));

    if i'm not wrong.. you have double parentNode

    Reply

  • Parvan Parvan admin's avatar

    Posted on Apr 30, 2009 (permalink)

    Hello Roman,

    Yes - you are right. This change is made in the attached zip file lightbox.zip in the last post (both attached files are the same).

    Just copy/overwrite the attached lightbox.js over the file in \[YourProject]\Sitefinity\ExternalLibraries\lightbox\js\lightbox.js.

    Kind regards,
    Parvan
    the Telerik team

    Instantly find answers to your questions on the newTelerik Support Portal.
    Check out the tipsfor optimizing your support resource searches.

    Reply

  • shae avatar

    Posted on Jul 14, 2009 (permalink)

    How would you add the discription to the lightbox pop up window?

    Reply

  • Georgi Georgi admin's avatar

    Posted on Jul 17, 2009 (permalink)

    Hi shae,

    Since the Description field is a metafield, you can use it in the front end, like the rest of the fields. The you should modify the javascript code - it should be taken the text from another DOM object rather than the image node and its alt tag. Another approach would be to dynamically save the description field to the image ALT tag.

    Kind regards,
    Georgi
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.

    Reply

  • Eric avatar

    Posted on Feb 4, 2010 (permalink)

    I'm trying to add a long description to a document in my document library. I have the following entry in my web.config

    <add key="Libraries.Description" valueType="LongText" visible="True" searchable="True" sortable="True" defaultValue=""/>

    However, I still get the "250 maximum characters" error and when I check the database (see attached), it is saving it as ShortText even though I've specified LongText in my config.

    Is this a bug? Am I doing something wrong? Any ideas?

    Reply

  • Ivan Dimitrov Ivan Dimitrov admin's avatar

    Posted on Feb 5, 2010 (permalink)

    Hello Eric,

    The metakey values should be persisted in LongText column.

    Make sure that you have set the following configuration settings.

    <add key="Libraries.Description" valueType="LongText" visible="True" searchable="True" sortable="True" defaultValue=""/>


    <libraryInfo>
        <add name="Image" title="Image Library" defaultExtenstions=".png, .jpg, .jpeg, .gif" metaKeys="Author, AlternateText, Extension, Name, Height, Width, Size, Category"></add>
        <add name="Document" title="Document Library" defaultExtenstions=".doc, .docx, .rtf, .txt, .pdf, .ppt, .pps, .pptx, .html, .xls, .xlsx" metaKeys="Author, Description, Extension, Name, Size, Category"></add>

    Restart the application and try again. We are not able to reproduce any problems working with Sitefinity 3.7 SP2.

    Regards,
    Ivan Dimitrov
    the Telerik team

    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
    Follow the status of features or bugs in PITS and vote for them to affect their priority.

    Reply

  • Eric avatar

    Posted on Feb 5, 2010 (permalink)

    Is there some kind of setting that I might have accidentally overwritten or another web.config entry somewhere that relates to document library descriptions? Everything is setup how you mentioned it. I noticed that when I add the following code:

    <add key="Libraries.Description" valueType="LongText" visible="True" searchable="True" sortable="True" defaultValue="test"/>

    specifically

    defaultValue="test"

    I doesn't pre-populate the description textarea. I am using 3.7 SP2.

    Reply

  • Ivan Dimitrov Ivan Dimitrov admin's avatar

    Posted on Feb 8, 2010 (permalink)

    Hi Eric,

    I am not able to reproduce problems with the way that Description is saved. If you could send a test project that I could debug I will be able to provide you with more information.

    All the best,
    Ivan Dimitrov
    the Telerik team

    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
    Follow the status of features or bugs in PITS and vote for them to affect their priority.

    Reply

  • Christian Calderon avatar

    Posted on May 7, 2010 (permalink)

    It is reproducible -  it happens when editing content that was created prior to changing the value type from ShortText to LongText.  The value type is stored on the table and is used when editing content items (it seems it works this way) so this change will in fact not affect previously created content.

    I had to do this in my dev env (for testing) and it worked well. Please keep in mind that you need to verify the "Application" field criteria to match whatever is that you need to adjust.

    update dbo.sf_GCMetaData
    set LongText = ShortText, ShortText = null,ValueType=2
    where KeyValue = 'Description' and Application='/Libraries'
    and LongText is null

    Sitefnity - is this considered a defect? is the above suggestion valid?

    Regards to all,
    Chris

    Reply

  • Ivan Dimitrov Ivan Dimitrov admin's avatar

    Posted on May 9, 2010 (permalink)

    Hello Christian Calderon,

    If you change the valueType of a metakey the new type applies only for items uploaded after the change. The old items will still use "ShortText" instead of "LongText"

    All the best,
    Ivan Dimitrov
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

    Reply

  • Register for webinar
Skip Navigation LinksHome / Developer Network / Forums / Sitefinity 3.x: Developing with Sitefinity > Description + Images Module Question