1

My client will have need of at least H4. In the text editor, I can add H4 to the ApplyClass menu, but this method applies a 

<span class="h4"> Sample </span>

inside the paragraph tag there. My H4 styling, and more importantly the actual weight of a header tag, is not hitting my text.

I've been trying variations of jQuery to addClass or remove/removeClass, but it's not my strong suit so I'm getting a few logic errors (like the Edit Page button is hidden because it is a span). I did see one example with a good answer that was specifically for the precise text in use (replacing a string after stripping out span). Since I want the client to be able to click "H4" when they're editing their content, this answer won't work for me.

No where in the wide wide world of DNN7 does there seem to be a request or need or workaround for not including H4-H6 in the FormatBlock menu where H1-H3 live. argh! Is there a way to add H4 - H6 into the FormatBlock Menu, or a JS/jQ way to actually use the correct header if I use these classes in the ApplyClass Menu?

End result must be client can select H4 from the menu, and their selection will be properly styled and an actual header.

VDWWD
  • 35,079
  • 22
  • 62
  • 79
NatashaRomanov
  • 13
  • 4

2 Answers2

0

If you can only add classes using DNN, I would suggest simply using CSS styles for .h4 classes. Then you could "match" the style of a normal h4 element.

However, h4 isn't a class, it's a markup element, much like an <input /> or <span></span>.

Using the CSS route should work, however using the standard h4 element will be much better if it is possible. (Also, it'll be more Accessible for those using a screen reader or similar software.)

FibreChips
  • 124
  • 3
  • 12
  • 1
    The client will most likely be unable to edit content on the HTML tab. Hence the need to have it available in one of the text editor menus or something clickable. thank you for a quick response :) – NatashaRomanov Feb 14 '17 at 18:26
0

If the editor is RadEditor, you can edit a config file to add h4 and h5

In the folde \DesktopModules\Admin\RadEditorProvider\ToolsFile, there is a file called toolsfile.xml. Add the extra items under the <paragraphs> node.

<paragraphs>
    <paragraph name="&lt;P>Standard Paragraph&lt;/P&gt;" value="&lt;P&gt;" />
    <paragraph name="&lt;H1>Heading 1&lt;/H1&gt;" value="&lt;H1&gt;" />
    <paragraph name="&lt;H2>Heading 2&lt;/H2&gt;" value="&lt;H2&gt;" />
    <paragraph name="&lt;H3>Heading 3&lt;/H3&gt;" value="&lt;H3&gt;" />

    <paragraph name="&lt;H4>Heading 4&lt;/H4&gt;" value="&lt;H4&gt;" />
    <paragraph name="&lt;H5>Heading 5&lt;/H5&gt;" value="&lt;H5&gt;" />  

    <paragraph name="&lt;P style='text-align:left'>Justify Left&lt;/P&gt;" value="&lt;P style='text-align:left'&gt;" />
    <paragraph name="&lt;P style='text-align:right'>Justify Right&lt;/P&gt;" value="&lt;P style='text-align:right'&gt;" />
    <paragraph name="&lt;P style='text-align:center'>Justify Center&lt;/P&gt;" value="&lt;P style='text-align:center'&gt;" />
</paragraphs>
VDWWD
  • 35,079
  • 22
  • 62
  • 79