These demos show how to strip all html from a string. You often need this in combination with crop or ellipsis to create teasers.
This tutorial inherits from the Custom.Hybrid.Razor14 or the Custom.Hybrid.RazorTyped base class.
Custom.Hybrid.Razor14
Custom.Hybrid.RazorTyped
This allows us to use Kit.Scrub to access an IScrub without having to use GetService<IScrub>.
Kit.Scrub
IScrub
GetService<IScrub>
<h1>Introduction</h1><p>Welcome to this blog post</p><hr><p>beginning with xyz we'll tell you more</p>
<h1>Introduction</h1><p>Welcome to this blog post<
@inherits Custom.Hybrid.RazorTyped @using ToSic.Razor.Blade @{ var val1 = "<h1>Introduction</h1><p>Welcome to this blog post</p><hr><p>beginning with xyz we'll tell you more</p>"; var cropLen = 50; } <h4>Original</h4> <code>@val1</code> <div>which if cropped at @cropLen would be really messy</div> <code>@val1.Substring(0, cropLen)</code>
Introduction Welcome to this blog post beginning with xyz we'll tell you more
@inherits Custom.Hybrid.RazorTyped @using ToSic.Razor.Blade @{ var val1 = "<h1>Introduction</h1><p>Welcome to this blog post</p><hr><p>beginning with xyz we'll tell you more</p>"; } <code>@Kit.Scrub.All(val1)</code>
Introduction Welcome to this blog post beginning…
@inherits Custom.Hybrid.RazorTyped @using ToSic.Razor.Blade @{ var val1 = "<h1>Introduction</h1><p>Welcome to this blog post</p><hr><p>beginning with xyz we'll tell you more</p>"; var cropLen = 50; } <code>@Html.Raw(Text.Ellipsis(Kit.Scrub.All(val1), cropLen))</code>
Only scrub specified tags using IScrub.Only(source, tag)
IScrub.Only(source, tag)
<h2><span>The cool title</span></h2>
<span>The cool title</span>
@inherits Custom.Hybrid.RazorTyped @using ToSic.Razor.Blade @{ var exampleTagsOnly = "<div><h2><span>The cool title</span></h2></div>"; } <div> <strong>Scrub one tag: </strong> <code>@Kit.Scrub.Only(exampleTagsOnly, "div")</code> </div> <div> <strong>Scrub multiple tags: </strong> <code>@Kit.Scrub.Only(exampleTagsOnly, new string[] { "div", "h2" }) </code> </div>
Scrub except the specified tags using IScrub.Except(source, tag)
IScrub.Except(source, tag)
<h2>The cool title</h2>
<div><span>The cool title</span></div>
@inherits Custom.Hybrid.RazorTyped @using ToSic.Razor.Blade @{ var exampleTagsExcept = "<div><h2><span>The cool title</span></h2></div>"; } <div> <strong>Scrub tags except one tag: </strong> <code>@Kit.Scrub.Except(exampleTagsExcept, "h2")</code> </div> <div> <strong>Scrub tags except multiple tags: </strong> <code>@Kit.Scrub.Except(exampleTagsExcept, new string[] { "div", "span" }) </code> </div>
These demos show how to scrub attributes of html source.
Using IScrub.Classes(source) you can scrub all classes.
IScrub.Classes(source)
<div ><strong >No</strong> classes allowed</div>
@inherits Custom.Hybrid.RazorTyped @using ToSic.Razor.Blade @{ var exampleClasses = "<div class='remove-me not-allowed'><strong class='not-allowed'>No</strong> classes allowed</div>"; } <div> <strong>Scrub all classes from source: </strong> <code>@Kit.Scrub.Classes(exampleClasses)</code> </div>
Using IScrub.Attributes(source, attributes) you can scrub attributes.
IScrub.Attributes(source, attributes)
<div>No attributes allowed</div>
<div not-allowed class='removed'>No attributes allowed</div>
<div class='removed'>No attributes allowed</div>
@inherits Custom.Hybrid.RazorTyped @using ToSic.Razor.Blade @{ var exampleAttributes = "<div remove-me not-allowed class='removed'>No attributes allowed</div>"; } <div> <strong>Scrub all attributes from source: </strong> <code>@Kit.Scrub.Attributes(exampleAttributes)</code> </div> <div> <strong>Scrub one attribute from source: </strong> <code>@Kit.Scrub.Attributes(exampleAttributes, "remove-me")</code> </div> <div> <strong>Scrub some attributes from source: </strong> <code>@Kit.Scrub.Attributes(exampleAttributes, new string[] { "remove-me", "not-allowed" }) </code> </div>
Using IScrub.Styles(source) you can scrub all styles.
IScrub.Styles(source)
<div >No styles allowed</div>
@inherits Custom.Hybrid.RazorTyped @using ToSic.Razor.Blade @{ var exampleStyle = "<div style='background-color: red; width: 50px; height: 50px;'>No styles allowed</div>"; } <div> <strong>Scrub all styles from source: </strong> <code>@Kit.Scrub.Styles(exampleStyle)</code> </div>