Supress rendering of HTML widget title

Topics: Customizing Orchard, General
Editor
Jul 19, 2011 at 8:38 PM

Hey guys,

I was wondering if anyone has the syntax to suppress an HTML widget's "Title" property throughout the site. Right now I suppress metadata for other types by using the following code in the placement.info file. Couldn't find the right combination for HTML widgets.

<Match DisplayType="Detail">
    <Place Parts_RoutableTitle="Nowhere" Parts_Common_Metadata="Nowhere"/>
  </Match>

Coordinator
Jul 19, 2011 at 8:49 PM

You'll want to match on the ContentType, not DisplayType. Also, you want to send it to "-", not "Nowhere".

Editor
Jul 19, 2011 at 8:52 PM

Like this? I didn't think widget was a content type:

<Match ContentType="Widget">
    <Place Parts_RoutableTitle="-" Parts_Common_Metadata="-"/>
  </Match>

Coordinator
Jul 19, 2011 at 9:53 PM

No, Widget is not the content type. The content type for the html widget is HtmlWidget.

Editor
Jul 19, 2011 at 10:44 PM

Yea still not working.

 

  <Match ContentType="HtmlWidget">
    <Place Parts_RoutableTitle="-" Parts_Common_Metadata="-"/>
  </Match>

They still spit out the titles.

Coordinator
Jul 19, 2011 at 11:08 PM

Oh, yes, right, the widget title doesn't come from Routable title. It doesn't even have this part. Digging...

Coordinator
Jul 19, 2011 at 11:10 PM

An easy thing you could do is make a Widget-HtmlWidget.cshtml alternate in your theme and not create the header zone in there. But I'm still digging to find what gets the title in there.

Coordinator
Jul 19, 2011 at 11:13 PM

Oh wait, the rendering of the title is right in widget-wrapper.cshtml, and it won't display it if it doesn't exist. So if you don't want a title, how about not providing one?

Editor
Jul 20, 2011 at 12:15 AM

You came full circle to where I was right before I started this project! Hahaha. Not providing a title is how I solved this issue prior, but the problem is when you have these widgets sitting on your zones screen with no titles it becomes hard for the end user to decipher what is what. I figured there had to be some way in placement.info to stop that from rendering, and I just didnt know the syntax. If not, then no titles it is.

Coordinator
Jul 20, 2011 at 12:17 AM

Well, you could modify the code in the wrapper.

Editor
Jul 20, 2011 at 12:20 AM

True. I will wait...I don't want to get out of sync with the Core code. If it is something I can fix and checkin I would be happy to take a look.

Coordinator
Jul 20, 2011 at 12:21 AM

Doing it in your theme is not going to get you out of sync with core.

Editor
Jul 20, 2011 at 12:27 AM

Oh....could you point me to a blog post or the documentation that shows how to do something like this? Are you saying I can override code files in my theme too?

Coordinator
Jul 20, 2011 at 12:30 AM

Just create a widget-wrapper.cshtml file in the views folder of your theme. That's it.

Editor
Jul 20, 2011 at 12:42 AM
Is that every widget? Can I do HtmlWidget-wrapper.cshtml ? Also does this work for list types? Like Can I create one called list-wrapper.cshtml or NewsItem-wrapper.cshtml for when it renders a list, I can modify the wrapper around it?

Arra

On Tue, Jul 19, 2011 at 8:30 PM, bertrandleroy <notifications@codeplex.com> wrote:

From: bertrandleroy

Just create a widget-wrapper.cshtml file in the views folder of your theme. That's it.

Read the full discussion online.

To add a post to this discussion, reply to this email (orchard@discussions.codeplex.com)

To start a new discussion for this project, email orchard@discussions.codeplex.com

You are receiving this email because you subscribed to this discussion on CodePlex. You can unsubscribe on CodePlex.com.

Please note: Images and attachments will be removed from emails. Any posts to this discussion will also be available online at CodePlex.com




--
Thanks,

Arra

Coordinator
Jul 20, 2011 at 12:46 AM

No, that will be for all widgets, but yes it will work for any shape. In summary: it will work for any shape, but not for any alternate of a shape.

Editor
Jul 20, 2011 at 12:56 AM
Gotcha. I just looked in the Module, \Modules\Orchard.Widgets\Views\Widget.Wrapper.cshtml, I am assuming I can just copy that code and remove the title rendering. Then drop that Widget-Wrapper.cshtml file into views. Sound right?

On Tue, Jul 19, 2011 at 8:46 PM, bertrandleroy <notifications@codeplex.com> wrote:

From: bertrandleroy

No, that will be for all widgets, but yes it will work for any shape. In summary: it will work for any shape, but not for any alternate of a shape.

Read the full discussion online.

To add a post to this discussion, reply to this email (orchard@discussions.codeplex.com)

To start a new discussion for this project, email orchard@discussions.codeplex.com

You are receiving this email because you subscribed to this discussion on CodePlex. You can unsubscribe on CodePlex.com.

Please note: Images and attachments will be removed from emails. Any posts to this discussion will also be available online at CodePlex.com




--
Thanks,

Arra

Coordinator
Jul 20, 2011 at 4:05 AM

Yes.

Editor
Jul 20, 2011 at 12:57 PM

Thanks again Bertrand this worked. For everyone:

I added a file in my Themes/Views folder called Widget.Wrapper.cshtml. I copied the code from \Modules\Orchard.Widgets\Views\Widget.Wrapper.cshtml and pasted it right into it. Next I added a line of code to check the widget type so I can filter when I want the titles to show:

 

@if (HasText(title) && Model.ContentItem.ContentType != "HtmlWidget")
        {
        <h1>@title</h1>
        }

 

So basically as long as it is not an HtmlWidget and has a title it will show the title.

Jul 27, 2011 at 5:43 PM

Just a follow up to this, as I'm running into the same issue...I don't want to just override Widget.Wrapper, so I can't just drop the alternate wrapper into my views of my theme...this question was asked above but never answered...can you provide a more specific view for a given widget to supress the title?


Instead of Widget.Wrapper.cshtml, can you specify something like HtmlWidget-Widget.Wrapper.cshtml? If so, what is the syntax for that?

Coordinator
Jul 27, 2011 at 6:18 PM

There are no alternates for wrappers, so HtmlWidget-Widget.Wrapper.cshtml won't work. Several things you can do: you can specify a wrapper in placement based on a match of your choice; you can suppress the wrapper (with an empty template override in your theme) and move the title and chrome into the widget template itself (and that has alternates so HtmlWidget-Widget.cshtml will work); or you can replace the wrapper conditionally from a handler through code.

Jul 27, 2011 at 6:26 PM
Edited Jul 27, 2011 at 6:27 PM

I tried the option of "specify a wrapper in placement based on a match of your choice" but couldn't get that to work.  I think if I could get that working, that'd be ideal. 

Suppressing the wrapper with an empty template (I assume you mean Widget-Wrapper.cshtml) made the widget not even show up.  What I ended up doing was to modify the Widget-Wrapper.cshtml to not include the header text and then just move the actual header text into my template as you suggested, though I don't like this method as much as I would a working version of your first suggestion.  Here's the code I was using:

My placement.info for the widget is as follows:

<place MyCustomWidget="Content:1;Wrapper=MyCustomWidget_Wrapper" /> 

with an alternate template named MyCustomWidget.Wrapper.cshtml in my theme. I would assume that
this syntax is incorrect. Can you assist with the correct syntax?
Coordinator
Jul 27, 2011 at 6:29 PM

That looks like it should work, except that MyCustomWidget has got to be the name of an actual shape. Also, I'm not sure whether placement will add a wrapper or replace the existing one. I can't try it right now.

Jul 27, 2011 at 6:34 PM
Edited Jul 27, 2011 at 6:34 PM

I just tried it.  It adds a wrapper, it doesn't replace it...that's what I saw before, so I guess when i say it "didn't work" I should say I got unexpected results.  So, there isn't a way to replace it then?

Coordinator
Jul 27, 2011 at 6:39 PM

Without code I'm afraid not. I think there should be, so I'll relay this internally so we can look at fixing that.

Jul 27, 2011 at 6:41 PM
Edited Jul 27, 2011 at 6:43 PM

I'm actually attempting to disprove my last statement...I might have applied it to the incorrect shape...I need to apply that placement to the widget shape, not the part shape that is on the widget...have to figure out what the widget syntax would be for that...

Coordinator
Jul 27, 2011 at 6:43 PM

I open this to track the issue: http://orchard.codeplex.com/workitem/18039

Aug 10, 2011 at 11:38 AM

I had this same issue and figured I would provide a fairly easy way to solve the problem without having to create a wrapper.  This only works if the widget is a custom type, or if you want to supress the title for all container widgets say.  You can use CSS to set the display to none and the height to zero.  It is not the best solution, but it is straight forward and can be pinpoint on custom widgets.  For example, you want to remove all of the titles from container widgets:

.widget-container-widget header h1
{
	display:none;
	height:0;
}

 Now the title will be removed from the display on the container widget, but be left for all other widgets.  I would imagine the best way to eventually accomplish this would be to extend the widget module and include a checkbox or some way to supress the title during the creation of the widget.  I do not think that would be all that difficult to accomplish actually.  Some widgets you want the title, while others you do not even if they are of the same type depending on the design of the site overall.  I suppose you could also create the Widget.Wrapper.cshtml on the custom widget and remove the title from there, but that seems short sighted from a module perspective because others may want the title for some reason you as the developer are not aware of.  Anyway, hope this helps.

Aug 10, 2011 at 12:00 PM

Another way to solve this is to add a regex to the Widget.Wrapper.cshtml (in your theme) that will display the title conditionally.  If the widget title then has [] around it then it will not show e.g. [My Widget].

var ttl = !string.IsNullOrEmpty(title) ? title.ToString() : string.Empty;
System.Text.RegularExpressions.Match match = System.Text.RegularExpressions.Regex.Match(ttl, @"\[(.*)\]", System.Text.RegularExpressions.RegexOptions.IgnoreCase); 

....

 @if (!match.Success) {
    <header>
        @if (HasText(title))
        {
        <h1>@title</h1>
        }
        @Display(Model.Header)
    </header>
    }
Aug 12, 2011 at 10:49 PM

Hi, I've created a module solving this issue. Working title is "Widget Link Title" and so far it has this features:

  • it's a Part, so it can be attached to any widget
  • it provides checkbox "Hide Title" 
  • the Title could be a link
  • it can point to any url you type or
  • there is a nice select box contains all content items with RoutePart sorted by content type and Title

I hope I can manage to public the module within next week.

 

 

 

Editor
Aug 13, 2011 at 12:03 AM
Excellent!!

On Fri, Aug 12, 2011 at 6:49 PM, janchvojka <notifications@codeplex.com> wrote:

From: janchvojka

Hi, I've created a module solving this issue. Working title is "Widget Link Title" and so far it has this features:

  • it's a Part, so it can be attached to any widget
  • it provides checkbox "Hide Title"
  • the Title could be a link
  • it can point to any url you type or
  • there is a nice select box contains all content items with RoutePart sorted by content type and Title

I hope I can manage to public the module within next week.

Read the full discussion online.

To add a post to this discussion, reply to this email (orchard@discussions.codeplex.com)

To start a new discussion for this project, email orchard@discussions.codeplex.com

You are receiving this email because you subscribed to this discussion on CodePlex. You can unsubscribe on CodePlex.com.

Please note: Images and attachments will be removed from emails. Any posts to this discussion will also be available online at CodePlex.com




--
Thanks,

Arra

Aug 21, 2011 at 10:09 PM

Finally...Widget Link Title!

 

Dec 20, 2012 at 11:07 AM

I have Orchard 1.6 with Widget Link Title installed and active

On my AsideSecond Widget I have a Projection but I can't find Widget Link Title. Can anyone help me, please?

Feb 26, 2013 at 4:15 PM
Edited Feb 26, 2013 at 4:34 PM
I may be coming to this a bit late, but just wanted add something to the mix.

Why is the widget title a "h1" ???? Doesn't this just break web standards rules big style?
Coordinator
Feb 26, 2013 at 4:59 PM
No :)
Coordinator
Feb 26, 2013 at 5:01 PM
http://www.w3.org/TR/html-markup/h1.html "The h1 through h6 elements are headings for the sections with which they are associated." (emphasis mine)

But it doesn't matter anyway because you can do anything you want in your theme.