When I insert a macro I am getting an empty <p> tag around my content, and due to the nature of my macro - it's throwing a validation error which is really inconvenient :)
Are there any solutions for preventing these paragraph tags (except manually deleting them of course)
I did think it was possible to change the way TinyMCE is configured to stop this happening. However after digging about a little this might not be the case.
Yeah I have read these posts today but the Jquery didnt work for me, also wanted to stop the problem at the root instead of overiding with, with JS that can be disabled by users anyway. Thanks for the help anyway!
My personal view is its is incredibly rare that I would want a client to be able to insert a macro into a page. As this opens a whole host of opportunity for them to insert it in a bad position (from a design point of view) or end up with additional unneeded tags, etc.
I have setup a new tab for the client to insert a video - which is a macro from Simple Video Player package. So basically they choose a video and it inserts it via a macro - which is then held in the template to display on every page.
I just need to get rid of these <p> </p> that are forcing new lines and validation errors.
I'm not aware of this package. Could you not however just has a text string field on the video tab? If they user pastes in the location of the video then you pass this value into your packages code? (i'm assume its XSLT)
Nice and simple XSLT test to see if there is anything in the field and some regex on the field to ensure its a valid URL (Starting with HTTP) and ending in which ever video file extensions you wish to support.
The video that user chooses will not be an external URL, it will be from the Media section so the package uses the "Media Picker" (I think it's called) to choose the video.
Just use a Content Picker datatype then to get the Node ID.
Then have a look at the XSLT, identify where it gets the ID from (something like /marco/mediaID) and update that to get the value the set in the Content Picker data type (something like $currentPage/data [@alias = 'theAliasYouSet])
I'm also using macro's in the tinymce editor and found it very frustrating to see all the empty paragraph elements messing up the layout of the pages. For now I found a solution, more kind of a workaround.
What you can do is hook up in the Document BeforeSave event and replace all the text that has empty paragraph tags:
public class DocumentBeforeSaveHandler : umbraco.BusinessLogic.ApplicationBase { public DocumentBeforeSaveHandler() { Document.BeforeSave += new Document.SaveEventHandler(Document_BeforeSave); }
/// <summary> /// Remove the empty paragraph tags at the beginning and end of a text /// </summary> /// <param name="sender"></param> private void RemoveEmptyParagraphTags(Document sender) { foreach (Property property in sender.getProperties) { if (property.Value is string && !string.IsNullOrEmpty(property.Value.ToString())) { Regex regex = new Regex(@"<p[^>]*>(\s| ?)*</p>"); property.Value = regex.Replace(property.Value.ToString(), ""); } } }
#endregion }
The only drawback of this solution is that you will still see paragraph tags in the html-editor of tinymce. Although sometimes. The content however will always be saved without the empty tags.
Hey Martijn, I've been using your above code for a while but it isn't quite right - it fires on the BeforeSave, which is bad, because when you submit the updated content from tinymce, that also fired on beforesave, and they overwrite each other. Instead, use AfterSave (just shove this block of code into your Global.asax.cs file):
P.S...you'll need to remove that space in the "& nbsp;" in the regex, this editor renders a space if I put it as a literal
public class UmbracoEvents : ApplicationBase
{
public UmbracoEvents()
{
umbraco.cms.businesslogic.web.Document.AfterSave += new umbraco.cms.businesslogic.web.Document.SaveEventHandler(RemoveEmptyParagraphTags);
}
///
/// Remove the empty paragraph tags inserted into TinyMCE for no good reason.
///
/// The document which was just saved
void RemoveEmptyParagraphTags(umbraco.cms.businesslogic.web.Document sender, umbraco.cms.businesslogic.SaveEventArgs e)
{
foreach (umbraco.cms.businesslogic.property.Property property in sender.GenericProperties)
{
if (property.Value is string && !string.IsNullOrEmpty(property.Value.ToString()))
{
Regex regex = new Regex(@"<p[^>]*>(\s|& nbsp;)*</p>");
property.Value = regex.Replace(property.Value.ToString(), "");
}
}
}
}
I tried to create a DLL using your code, but I must have done something wrong. I don't have a global.asax so I couldn't put it there. Basically, I just created a project, put your code into it. Compiled it and copied the value into the bin directory.
Gonna bump this for an addition for 4.5.2, this checks the type of the property explicitly looking for a TinyMCE type. Also the RegEx has been enchanced to find the new "<p><br /> <br /></p>" that gets put in sometimes in addition to the empty paragraph tags.
Edit: You will need to remove the space from "& nbsp;" in the regex string. I cannot for the life of me to get it to not turn it into a space...
private static void RemoveEmptyParagraphTags(umbraco.cms.businesslogic.web.Document sender)
{
foreach (umbraco.cms.businesslogic.property.Property property in sender.getProperties)
{
var propType = property.PropertyType.DataTypeDefinition.DataType.GetType();
var tinyMce = typeof (umbraco.editorControls.tinyMCE3.tinyMCE3dataType);
if (propType == tinyMce && !string.IsNullOrEmpty(property.Value.ToString()))
{
var regex = new Regex(@"<p[^>]*>(<br[^>]*>)*(\s|& nbsp;|\r|\n)*(<br[^>]*>)*(\s|& nbsp;|\r|\n)*</p>");
property.Value = regex.Replace(property.Value.ToString(), string.Empty);
}
}
}
Empty p tag when inserting macro into text editor
Hi everyone,
When I insert a macro I am getting an empty <p> tag around my content, and due to the nature of my macro - it's throwing a validation error which is really inconvenient :)
Are there any solutions for preventing these paragraph tags (except manually deleting them of course)
Thanks, Garry.
I did think it was possible to change the way TinyMCE is configured to stop this happening. However after digging about a little this might not be the case.
Have a look at;
http://our.umbraco.org/forum/using/ui-questions/4224-Tinymce-adding-in-p-p-tags-before-and-after-inline-macros
and
http://forum.umbraco.org/yaf_postst6644_Insert-Macro-adds-a-paragraph-tag.aspx (old forum)
Yeah I have read these posts today but the Jquery didnt work for me, also wanted to stop the problem at the root instead of overiding with, with JS that can be disabled by users anyway. Thanks for the help anyway!
Garry.
In what context are you inserting the macro?
My personal view is its is incredibly rare that I would want a client to be able to insert a macro into a page. As this opens a whole host of opportunity for them to insert it in a bad position (from a design point of view) or end up with additional unneeded tags, etc.
Laurie
(i'd edit that, but I can't! but it wasn't supposed to be in Bold! more Italics, as a after thought!)
Hi LaurenceG,
I have setup a new tab for the client to insert a video - which is a macro from Simple Video Player package. So basically they choose a video and it inserts it via a macro - which is then held in the template to display on every page.
I just need to get rid of these <p> </p> that are forcing new lines and validation errors.
Cheers.
I'm not aware of this package. Could you not however just has a text string field on the video tab? If they user pastes in the location of the video then you pass this value into your packages code? (i'm assume its XSLT)
Nice and simple XSLT test to see if there is anything in the field and some regex on the field to ensure its a valid URL (Starting with HTTP) and ending in which ever video file extensions you wish to support.
/Laurie
Hi Laurence,
The video that user chooses will not be an external URL, it will be from the Media section so the package uses the "Media Picker" (I think it's called) to choose the video.
Garry
Just use a Content Picker datatype then to get the Node ID.
Then have a look at the XSLT, identify where it gets the ID from (something like /marco/mediaID) and update that to get the value the set in the Content Picker data type (something like $currentPage/data [@alias = 'theAliasYouSet])
/Lau
I'm also using macro's in the tinymce editor and found it very frustrating to see all the empty paragraph elements messing up the layout of the pages. For now I found a solution, more kind of a workaround.
What you can do is hook up in the Document BeforeSave event and replace all the text that has empty paragraph tags:
The only drawback of this solution is that you will still see paragraph tags in the html-editor of tinymce. Although sometimes. The content however will always be saved without the empty tags.
Hey Martijn, I've been using your above code for a while but it isn't quite right - it fires on the BeforeSave, which is bad, because when you submit the updated content from tinymce, that also fired on beforesave, and they overwrite each other. Instead, use AfterSave (just shove this block of code into your Global.asax.cs file):
P.S...you'll need to remove that space in the "& nbsp;" in the regex, this editor renders a space if I put it as a literal
James -
I tried to create a DLL using your code, but I must have done something wrong. I don't have a global.asax so I couldn't put it there. Basically, I just created a project, put your code into it. Compiled it and copied the value into the bin directory.
Did i miss something?
-C
never mind... I think I just needed to restart my app. D'oh!
Gonna bump this for an addition for 4.5.2, this checks the type of the property explicitly looking for a TinyMCE type. Also the RegEx has been enchanced to find the new "<p><br /> <br /></p>" that gets put in sometimes in addition to the empty paragraph tags.
Edit: You will need to remove the space from "& nbsp;" in the regex string. I cannot for the life of me to get it to not turn it into a space...
private static void RemoveEmptyParagraphTags(umbraco.cms.businesslogic.web.Document sender) { foreach (umbraco.cms.businesslogic.property.Property property in sender.getProperties) { var propType = property.PropertyType.DataTypeDefinition.DataType.GetType(); var tinyMce = typeof (umbraco.editorControls.tinyMCE3.tinyMCE3dataType); if (propType == tinyMce && !string.IsNullOrEmpty(property.Value.ToString())) { var regex = new Regex(@"<p[^>]*>(<br[^>]*>)*(\s|& nbsp;|\r|\n)*(<br[^>]*>)*(\s|& nbsp;|\r|\n)*</p>"); property.Value = regex.Replace(property.Value.ToString(), string.Empty); } } }
rad
is working on a reply...