Styling the html templates

Forum dedicated to Mods for HESK created by Mike Koch

Moderator: mkoch227

Post Reply
rebeloda
Posts: 9
Joined: Sun Jan 03, 2016 2:31 am

Styling the html templates

Post by rebeloda »

Hi, have been struglling to find a way to style the html templates needing so to have the full headers on the page.
By default TinyMCE is only interested in your page's content which is contained within the document's <body> part.
If you want to have TinyMCE edit every part of your document, especially the <head> section, we need the so called fullpage plugin as described at http://archive.tinymce.com/wiki.php/Plugin3x:fullpage

This is what was done.
As usual backups are necessary and things are done at You own risk.

1. download the plugin(or the full package and use only the fullpage folder, make sure it is version 3).

2. create the folder plugins and upload in it the fullpage folder, something like this:
hesk/inc/tiny_mce/3.5.11/plugins/fullpage

3. edit hesk/manage_email_templates.php tinyMce.init
aroun line 38 we will find:

Code: Select all

if ($modsForHesk_settings['html_emails']) {
    echo '<script type="text/javascript">
        tinyMCE.init({
                        mode : "textareas",
                        editor_selector : "htmlEditor",
                        elements : "content",
                        theme : "advanced",
                        convert_urls : false,
                        gecko_spellcheck: true,
                        theme_advanced_buttons1 : "cut,copy,paste,|,undo,redo,|,formatselect,fontselect,fontsizeselect,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull",
                        theme_advanced_buttons2 : "sub,sup,|,charmap,|,bullist,numlist,|,outdent,indent,insertdate,inserttime,preview,|,forecolor,backcolor,|,hr,removeformat,visualaid,|,link,unlink,anchor,image,cleanup,code",
                        theme_advanced_buttons3 : "",
                        theme_advanced_toolbar_location : "top",
                        theme_advanced_toolbar_align : "left",
                        theme_advanced_statusbar_location : "bottom",
                        theme_advanced_resizing : true
                    });
                </script>';	
Add to it the functions needed, at least the plugins : "fullpage".
The fullpage_default_title can also be handy.
It can be something like this:

Code: Select all

if ($modsForHesk_settings['html_emails']) {
    echo '<script type="text/javascript">
        tinyMCE.init({
                        mode : "textareas",
                        editor_selector : "htmlEditor",
                        elements : "content",
                        theme : "advanced",
			plugins : "fullpage",
			fullpage_default_title : "Your default page title",
                        convert_urls : false,
                        gecko_spellcheck: true,
                        theme_advanced_buttons1 : "cut,copy,paste,|,undo,redo,|,formatselect,fontselect,fontsizeselect,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull",
                        theme_advanced_buttons2 : "sub,sup,|,charmap,|,bullist,numlist,|,outdent,indent,insertdate,inserttime,preview,|,forecolor,backcolor,|,hr,removeformat,visualaid,|,link,unlink,anchor,image,cleanup,code",
                        theme_advanced_buttons3 : "",
                        theme_advanced_toolbar_location : "top",
                        theme_advanced_toolbar_align : "left",
                        theme_advanced_statusbar_location : "bottom",
                        theme_advanced_resizing : true
                    });
                </script>';
And its done.
You have now the html and head sections where you can add the inline css, etc.

Enjoy it
Rebelo
Post Reply