1-888-365-2779
+1-888-365-2779
Try Now
More in this section

Forums / Developing with Sitefinity / image next to title above generic content control

image next to title above generic content control

11 posts, 0 answered
  1. Mart
    Mart avatar
    66 posts
    Registered:
    10 Aug 2006
    26 Oct 2009
    Link to this post
    Hello,

    I'm struggeling with your article "How to wrap a Generic Content control in 3.6 SP1"

    I want an image next to the title above the generic content to appear from a theme in the app_theme folder within sitefinity
    It should also be possible to select an image in the advanced tab of the gc_wrapper control from the image library

    do you have any suggestions please?

    Mart

  2. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    16 Jun 2017
    26 Oct 2009
    Link to this post
    Hi Mart,

    It is possible.

    1. Create a custom control that inherits from Generic Content.
    2. Override LayoutTemplatePath property and set your custom template that should have Image control.
    3. Create a control reference to the ImageControl.
    4. Create a public property with WebEditor that will allow you to select items from Image and Documents module.
    5. Then sent the returned value as Image url.


    Greetings,
    Ivan Dimitrov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  3. Mart
    Mart avatar
    66 posts
    Registered:
    10 Aug 2006
    26 Oct 2009
    Link to this post
    Hello Ivan,

    thanks for your quick response

    I accomplished step 1 and 2. those where in the sample but can you help me with the other steps?

    thankx

    Mart
  4. Mart
    Mart avatar
    66 posts
    Registered:
    10 Aug 2006
    27 Oct 2009
    Link to this post
    Hello,
     
    maybe a bit silly but i think I accomplished step to step 4 now.
    But how to do step 5? 

    Hope you want to help me.

    Mart.


    p.s. this is my code in GC_Wapper.cs so far:

    using

     

    System;

     

    using

     

    System.Collections.Generic;

     

    using

     

    System.ComponentModel;

     

    using

     

    System.Linq;

     

    using

     

    System.Text;

     

    using

     

    System.Web;

     

    using

     

    System.Web.UI;

     

    using

     

    System.Web.UI.WebControls;

     

    using

     

    Telerik.Cms.Web.UI;

     

    using

     

    Telerik.Web;

     

    using

     

    Telerik.Cms.Engine.WebControls;

     

    using

     

    Telerik.Framework.Web.Design;

     

    using

     

    System.Web.UI.HtmlControls;

     

    using

     

    Telerik.Framework.Web;

     

    using

     

    System.IO;

     

    using

     

    System.Reflection;

     

    namespace

     

    ArtisteerAddon

     

    {

     

    /// <summary>

     

     

    /// Demonstrates how to wrap a Generic Content control and use the full functionality

     

     

    /// of the base class.

     

     

    /// </summary>

     

    [

    DefaultProperty("ContentTitle")]

     

    [

    ToolboxItem(typeof(GCWrapperToolboxItem))]

     

    [

    ToolboxData("<{0}:ServerControl1 runat=server></{0}:ServerControl1>")]

     

     

    public class GCWrapper : GenericContent

     

    {

    #region

     

    layout properties

     

     

    /// <summary>

     

     

    /// Used for loading controls from a template (defines the layout)

     

     

    /// </summary>

     

    [

    Browsable(false)]

     

     

    protected virtual GenericContainer Container

     

    {

     

    get

     

    {

     

    if (this.container == null)

     

    {

     

    this.container = new GenericContainer();

     

     

    if (this.LayoutTemplate != null)

     

    {

     

    this.LayoutTemplate.InstantiateIn(this.container);

     

    }

    }

     

    return this.container;

     

    }

    }

     

    /// <summary>

     

     

    /// Gets or sets the template defining the layout of the control.

     

     

    /// </summary>

     

    [

    TemplateContainer(typeof(GenericContainer))]

     

    [

    PersistenceMode(PersistenceMode.InnerProperty)]

     

    [

    Description("Gets or sets the template defining the layout of the control.")]

     

    [

    Browsable(false)]

     

    [

    DefaultValue(typeof(ITemplate), "")]

     

     

    public virtual ITemplate LayoutTemplate

     

    {

     

    get

     

    {

     

    if (this.layoutTemplate == null)

     

    {

     

    this.layoutTemplate = ControlUtils.GetTemplate(this.LayoutTemplatePath,

     

     

    this.LayoutTemplateName, this.GetType());

     

    }

     

    return this.layoutTemplate;

     

    }

     

    set

     

    {

     

    this.layoutTemplate = value;

     

    }

    }

     

     

     

    /// <summary>

     

     

    /// Gets or sets the path to a custom layout template for the control.

     

     

    /// </summary>

     

    [

    Browsable(true)]

     

    [

    Category("Appearance")]

     

    [

    Description("Gets or sets the path to a custom layout template for the control.")]

     

    [

    EmbeddedTemplate(GCWrapper.GCWrapperLayoutTemplatePath, "Layout template path for GC wrapper", "/Templates/", true, "2009/3/31")]

     

     

    public virtual string LayoutTemplatePath

     

    {

     

    get

     

    {

     

    object persistedValue = this.ViewState["LayoutTemplatePath"];

     

     

     

    if (persistedValue != null)

     

    {

     

    return (string)persistedValue;

     

    }

     

    else

     

    {

     

    return String.Empty;

     

    }

    }

     

    set

     

    {

     

    this.ViewState["LayoutTemplatePath"] = value;

     

    }

    }

     

    /// <summary>

     

     

    /// Gets the name of the embedded layout template. This property must be overridden to provide the path (key) to an embedded resource file.

     

     

    /// </summary>

     

    [

    Browsable(false)]

     

     

    public virtual string LayoutTemplateName

     

    {

     

    get

     

    {

     

    return GCWrapper.GCWrapperLayoutTemplatePath;

     

    }

    }

    #endregion

    #region

     

    properties

     

     

    /// <summary>

     

     

    /// The text of the title above the content area

     

     

    /// </summary>

     

    [

    Browsable(true)]

     

    [

    Category("Appearance")]

     

    [

    Description("The text of the title above the content area")]

     

    [

    TypeConverter(typeof(StringConverter))]

     

     

    public string ContentTitle

     

    {

     

    get { return this.ContentTitleText.Text; }

     

     

    set { this.ContentTitleText.Text = value; }

     

    }

     

    [

    WebEditor("Telerik.Libraries.WebControls.ImageSelector, Telerik.Libraries")]

     

    [

    Browsable(true)]

     

    [

    Category("Appearance")]

     

    [

    Description("The image next to the title above the content area")]

     

    [

    TypeConverter(typeof(StringConverter))]

     

     

    public string SelectImage

     

    {

     

    get

     

    {

    return this.image; }

     

     

    set

     

    {

    this.image = value; }

     

    }

     

    private string image;

     

    #endregion

     

    #region

     

    control references

     

     

    /// <summary>

     

     

    /// The title above the content

     

     

    /// </summary>

     

    [

    Browsable(false)]

     

     

    public ITextControl ContentTitleText

     

    {

     

    get { return this.Container.GetControl<ITextControl>("title", true); }

     

    }

     

    /// <summary>

     

     

    /// The titleimage above the content

     

     

    /// </summary>

     

    [

    Browsable(false)]

     

     

    public Image ContentTitleImageURL

     

    {

     

    get { return this.Container.GetControl<Image>("TitleImage", true); }

     

    }





     

    /// <summary>

     

     

    /// The wrapped generic content control

     

     

    /// </summary>

     

    [

    Browsable(false)]

     

     

    public ITextControl ContentPlaceholder

     

    {

     

    get { return this.Container.GetControl<ITextControl>("content", true); }

     

    }

    #endregion

    #region

     

    methods

     

     

    /// <summary>

     

     

    /// This message will be displaye when the control is initially dragged

     

     

    /// onto the design surface

     

     

    /// </summary>

     

     

    /// <returns>a message to display when there is no content in the control</returns>

     

     

    public override string SetEmptyControlDefaultMessage()

     

    {

     

    return "This control will not display properly in design mode!";

     

    }

     

    /// <summary>

     

     

    /// Called to write the actual html for this control

     

     

    /// </summary>

     

     

    /// <remarks>

     

     

    /// Will not render properly in design mode due to the implementation of the

     

     

    /// GenericContentDesigner.

     

     

    /// </remarks>

     

     

    /// <param name="writer">a stream that is specialized in wrtinig html output</param>

     

     

    protected override void Render(HtmlTextWriter writer)

     

    {

     

    StringWriter content = null;

     

     

    HtmlTextWriter contentWriter = null;

     

     

     

    try

     

    {

     

    // if in normal mode, output the full content of the control

     

     

    if (!this.DesignMode)

     

    {

     

    // first, we need to "extract"

     

    content =

    new StringWriter();

     

    contentWriter =

    new HtmlTextWriter(content);

     

     

    base.Render(contentWriter);

     

     

    this.ContentPlaceholder.Text = content.ToString();

     

     

    // we need to do this manually, as generic content control renders its

     

     

    // content directly and does not inherit CompositeControl,

     

     

    // so it will not render out template correctly (not at all, actually)

     

     

    foreach (Control child in this.Controls)

     

    {

    child.RenderControl(writer);

    }

     

    // for some reason, CreateChildConrols is never called, so we do this manually

     

     

    if (!this.Controls.Contains(this.Container))

     

    {

     

    this.Container.RenderControl(writer);

     

    }

    }

     

    else

     

    {

     

    // if in edit (design) mode, output the content of the genreric content control

     

     

    // THIS IS REQUIRED

     

     

    base.Render(writer);

     

    }

    }

     

    finally

     

    {

     

    // I don't use "using", as I dislike nested "using"-s

     

     

    if (content != null)

     

    {

    content.Dispose();

    }

     

    if (contentWriter != null)

     

    {

    contentWriter.Dispose();

    }

    }

    }

    #endregion

    #region

     

    constants

     

     

    public const string GCWrapperLayoutTemplatePath = "ArtisteerAddon.Resources.Templates.GC_WrapperTemplate.ascx";

     

    #endregion

    #region

     

    fields

     

     

    /// <summary>

     

     

    /// Holds the value of the LayoutTemplate property

     

     

    /// </summary>

     

     

    private ITemplate layoutTemplate;

     

     

     

    /// <summary>

     

     

    /// Holds the value of the Container property

     

     

    /// </summary>

     

     

    private GenericContainer container;

     

    #endregion

    }

    }



  5. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    16 Jun 2017
    27 Oct 2009
    Link to this post
    Hi Mart,

    1. Generic content control outputs only what you have added to the RadEditor area. So the easiest way will be typing the text for the title in Design on Html tab then add image near this title. This control does not display the title of any content by default.

    If you are sure that you want to use this control - GenericContent  you need to implement a new field in the designer that will be used for the Title and under this field you can add image. Both the fields should be a public properties,so that they can be set through ControlDesigner advanced tab. Instead of Using GenericContent control, I think it will be better to you ContentView control and create items through the backend of Sitefinity. Then show only a sected content instead of List of items. This control renders the title by default and you can easily extend the template and add an image.

    Let me know what is the preffered way and I will send you some code snippets.

    Best wishes,
    Ivan Dimitrov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  6. Mart
    Mart avatar
    66 posts
    Registered:
    10 Aug 2006
    27 Oct 2009
    Link to this post
    Hello Ivan,

    some context:
    I try to make it possible to use the output from artisteer with sitefinity because it is an easy tool to design websites.
    The output of artisteer is a asp.net website with complete masterpage, styles and two user controls one for articles and one for block texts.

    This is why I want to make a control GC_wrapper make sitefinity and artisteer together.

    The first module (article) is a control with a title and an image and below that some text content
    For the title my dll works but now i have to implement the image.
    In artisteer template the image comes from seperate folder so I can upload that Image to sitefinity
    but is has to show in the "header" next to the title.

    I have attached an example picture



  7. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    16 Jun 2017
    27 Oct 2009
    Link to this post
    Hi Mart,

    Generic Content control is not  a proper control because you cannot have a template for the public side and you should use render method to display your content.


    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using Telerik.Cms.Engine.WebControls;
    using System.ComponentModel;
    using Telerik.Framework.Web.Design;
    using System.Web.UI;
    using Telerik.Framework.Web;
    using System.Web.UI.WebControls;
    using Telerik.Cms.Web.UI;
    using Telerik.Web;
    using Telerik.Libraries;
    using Telerik.Cms.Engine;
     
    /// <summary>
    /// Summary description for GenericContentCustom
    /// </summary>
    ///
     
    public class CustomGenericContentToolboxItem : ToolboxItem
    {
        /// <summary>
        /// Initializes a new instance of GenericContentToolboxItem class and sets DisplayName and Description
        /// properties for the GenericContent control.
        /// </summary>
        public CustomGenericContentToolboxItem()
            : base(typeof(GenericContentCustom))
        {
            base.DisplayName = "test";
            base.Description = "desc";
        }
    }
     
    [ToolboxItem(typeof(CustomGenericContentToolboxItem))]
    public class GenericContentCustom : GenericContent
    {
        public GenericContentCustom()
        {
     
        }
     
     
         public string NotSharedContentTitle
         {
            get
            {
                string cntTitle = (string)ViewState["NotSharedContentTitle"];
                return ((cntTitle == null) ? String.Empty : cntTitle);
            }
            set
            {
                this.ViewState["NotSharedContentTitle"] = value;
            }
         }
     
         public Guid ImageID
         {
             get
             {
                 object ids = ViewState["ImageID"];
                 if (ids == null)
                     return Guid.Empty;
                 return (Guid)ids;
             }
             set
             {
                 this.ViewState["ImageID"] = value;
             }
         }
        
     
        protected override void Render(HtmlTextWriter writer)
        {
            base.Render(writer);
            writer.Write(NotSharedContentTitle);
              // DO THE SAME TO GET THE IMAGE URL

          }
     
     
        #region private
        # endregion
    }

    Another option could be wrapping generic content control in user control, but GenericContent does not work property in this scenario.

    Kind regards,
    Ivan Dimitrov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  8. Mart
    Mart avatar
    66 posts
    Registered:
    10 Aug 2006
    27 Oct 2009
    Link to this post
    Hello Ivan,

    I accomplished it so far in the code i'ver sent you
    I do not understand why it is not possible to bind the image to the template
     If it is possiible for a title property i set why not for an image i get from a library?

    Yours,

    Mart

    ps. please remember i use the sample from  "How to wrap a Generic Content control in 3.6 SP1"
  9. Mart
    Mart avatar
    66 posts
    Registered:
    10 Aug 2006
    27 Oct 2009
    Link to this post
    Please help,

    i realy need to fix this. A new prospect wants to see this before he decides to buy my product with sitefinity
  10. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    16 Jun 2017
    27 Oct 2009
    Link to this post
    Hi Mart,

    The value of the image should be set on Render method and my example and the KB you use shows. As I see it in your code, on Render method you does not sent any other value than this.ContentPlaceholder.Text = content.ToString(); You need to add the image url returned from your property to Image.ImageUrl propeprty of Image control that you should use.

    Let me know how it goes.

    Greetings,
    Ivan Dimitrov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  11. Mart
    Mart avatar
    66 posts
    Registered:
    10 Aug 2006
    28 Oct 2009
    Link to this post
    Hello Ivan,

    I indeed had to change the url

    Thanks for your support. It was great


Register for webinar
11 posts, 0 answered