Forums

Home / Developer Network / Forums / Sitefinity 3.x: Deployment > Linking an image with Radeditor

• Tom Tham

  Posted on Feb 15, 2010 (permalink)

  When I add an image in a Generic Content module, then try to link the image to a url, the <img> gets removed completely and replaced by the <a> tag. The <a> text is populated with the alt tag information from the <img>.
  
  How do i insert an image into a Generic Content module and link it to a url?

  Reply

• Ivan Dimitrov Ivan Dimitrov

  Posted on Feb 15, 2010 (permalink)

  Hi Tom Tham,
  
  All build-in controls that uses RadEditor have a custom Document, Image and Link managers. This managers allow you to add items from Images and Documents module. The Image manager uses img tag when you insert an image
  
  sample
  
  

  <img src="/Libraries/University_People/Billy_and_John_with_an_unknown_girl_on_graduation_day.sflb" alt="Graduation group photo" sfref="[Libraries]0d1c5fd9-1d6b-4893-87af-40b85fe8f467" />

  
  The tag is not replaced on the front end, because the image is correctly displayed by src tag. You could give a try to our demo website. If your approach is different, please send us some steps and screenshots that represents the steps you follow.
  
  Sincerely yours,
  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

• Tom Tham

  Posted on Feb 15, 2010 (permalink)

  Thank you but I must have misstated my problem.
  
  I want the <img> to be wrapped in an <a> tag. Thus when the user 'clicks' the image, they will be taken to another page on the site, or another site completely.
  
  Workflow:
  1. Insert <img> into a Generic Content Module.
  2. Wrap <img> with an <a> tag.

  Reply

• Ivan Dimitrov Ivan Dimitrov

  Posted on Feb 16, 2010 (permalink)

  Hello Tom Tham,
  
  You can use set_html client side method of RadEditor control to wrap the img tag inside a tag
  
  sample code
  
  

  function OnClientSubmit(editor, args) {

         var cnt = editor.get_html(true)

         editor.set_html("<a>" + cnt + "</a>");

           

      }

  
  
  Kind regards,
  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

• Tom Tham

  Posted on Feb 16, 2010 (permalink)

  I'm going to try once more...
  
  This thread addresses the same problem, but I'm using 3.7:
  http://www.sitefinity.com/support/forums/sitefinity-3-x/bugs-issues/image-as-a-link.aspx
  
  This is for my client 'content editor' role. This is not for a programmer. Please don't post another script or c# code.
  
  Workflow:
  1. Insert <img>
  2. Select <img>
  2. Add <a href=""> to <img>
  3. Publish content.
  4. User clicks <img>
  5. User is taken to another page.

  Reply

• Ivan Dimitrov Ivan Dimitrov

  Posted on Feb 16, 2010 (permalink)

  Hi Tom Tham,
  
  The code shows how to extend the control functionality. You/or a developer needs to implement this logic.
  However you requirement works without problems on 3.7 SP1 and 3.7 SP2.
  
  steps
  
  1. Insert an image
  2. Click on the image
  3. Click on InsertLink
  4. Add a link
  5. The img tag will be wrapped in a tag
  6. Save the control
  
  You can give a try on http://demo.sitefinity.com 
  
  Regards,
  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

• Tom Tham

  Posted on Feb 16, 2010 (permalink)

  We must be missing a SP.
  
  Thank you.

  Reply

• Nicolas

  Posted on Aug 31, 2010 (permalink)

  i use 3.6 and there is a way :-)
  
  right click on the image
  choose image map editor
  created an area on the whole image and put you link for it
  
  I know it is not as clean but at least it works and you can tell an editor to do that and they will understand
  
  

  Reply

Home / Developer Network / Forums / Sitefinity 3.x: Deployment > Linking an image with Radeditor