Skip to main content
MindTouch Success Center

Add HTML

Adding HTML in MindTouch

The following encapsulates everything you might need to know about adding HTML (HTML5) to your MindTouch environment (Professionals Only).

First off, the way to add HTML on each page is NOT through the "</> HTML" or "View > Source".

  • HTML should only be added through the Smart Content Editor and then selecting Style > DekiScript once in edit mode via the "Edit" button found in the user menu. DekiScript is a language MindTouch created that allows uniquely formatted HTML and JS, inlined CSS, and page manipulation such as template calls, content reuse, content trees, machine learning, and more to be created all under 1 type of scripting language. Being all of these things, it is worth noting that the syntax will be different from what you may be used to with other HTML. See 'Syntax Differences' below to see everything that is different from what you are used to.
  • The problem with adding complex HTML via the View Source of HTML view mode is because on save or on the flip of the editor back to the visual mode, the HTML elements sometimes get injected with paragraph elements and has been known to change to keep the source error free and keep the same reliability we had before (WYSIWYG). Adding classes and ids for instance will always work in the "View" > "Source/HTML", but changing the structure and tags will likely change. If you wish to find out more about this, let your account's Customer Success MindTouch Representative know, but just be aware that HTML written in a DekiScript block will never change and will always preform the same way it did the last time it was edited. Once again, see 'Syntax Differences' below to see syntax changes that you might be used to doing in HTML5 that might not work in your DekiScript block.

Where to put HTML

The following covers where and what to do based on the nature of the HTML change you would like to make.

Note to user   NOTE:  Once again, this is for Professionals Only so if do not have expertise in the branding field (HTML, CSS, etc) please stop and either pass the following to your in-house resource for branding/design/UI-UX/front-end development or consult your account's Customer Success Manager Representative. Your CSM will work through these things ideally getting a checklist from you (given the size of your requested changes) or submit a ticket to our professional services to scope out your checklist of changes and provide an accurate quote. Please additionally note that our support team will not write code for you (see 'Branding Support' for information on what they can help with).

Single Page HTML

In the event you wish to add your own HTML to an individual page within your MindTouch environment, such as the home page, you just edit that given page and apply the given HTML you wish to add directly to the page in a DekiScript block.

Multiple Page HTML (Global)

Should you wish to apply HTML on every page, every content page, every special page, or globally but only to certain users, browser, or whatever else, you are going to use a combination of CSS in the Control Panel and HTML in the template directories. Based on where you would like to place it on the following for all pages, you can use the following image. For all other branding regions, refer to 'Regions'.

Branding Regions.png

 

The most popular branding regions are the Header, Footer, and then Content Header and Footer. Links to the Header and Footer can be found in the Site Tools > Dashboard > Branding > Header Template or by navigating to the Template Directory within the Dashboard and locating the said template you are trying to access.

Header and Footer template locations.png

Note to user   NOTE:  The Content Header and Content Footer templates will not appear for your given site by default, but upon request to your account's Customer Success Manager Representative, we can turn that on for you. Also note that the Content Header can also double as a Content Sidetray should you decide that is the experience you are looking for.

Within Meta Tag

In the event you want to add things to the Page Head, Meta Tag, or Page Tail, please do not add it to the header, footer, or any other template. Things such as font-family sources or an additional Google Analytic authentication need to be done in the Site Tools > Control Panel > Custom HTML > Page Head (see ' Custom HTML' for more). 

Note to user   NOTE:  You need an admin account to access the control panel so if you don't have access, submit a request up the chain to someone who does. In addition to prevent potential site-breakages and site load problems, it is strongly recommended you run by all Page Head and Page Tail changes you are planning to make to your account's Customer Success MindTouch Representative before doing so they might verify you are not going to cause harm to your userbase with your change.

Syntax differences between HTML and DekiScript

Text must be surrounded by quotes

  • HTML 
<h1>Title</h1>
<p>Words</p>
  • DekiScript
<h1>'Title'</h1>
<p>'Words'</p>

/* or */

<h1>"Title"</h1>
<p>"Words"</p>

Quotes within text must be escaped with a backslash

  • HTML 
<p>John's Car</p>
<p>Did you read the book "Book title"?</p>
  • DekiScript
<p>'John\'s Car'</p>
<p>'Did you read the book "Book title"?'</p>

/* or */

<p>"John's Car"</p>
<p>"Did you read the book \"Book title\"?"</p>

Breaks, images and a few other blocks break without a closing slash or tag

  • HTML
<img src="tree.png" alt="Tree">
<br>
<p>Tree Description</p>
  • DekiScript
<img src="tree.png" alt="Tree"/>
<br/>
<p>'Tree Description'</p>

/* or */

<img src="tree.png" alt="Tree"></img>
<br></br>
<p>'Tree Description'</p>

Inline text of different html tags must be separated by a semi colon

  • HTML
<p>Do <strong>NOT</strong> forget to wear protective eyeware</p>  
  • DekiScript
/* DekiScript Equivalent */
<p>'Do '; <strong>'NOT '</strong>; 'forget to wear protective eyeware'</p>

/* or */

<p>'Do ';
<strong>'NOT '</strong>;
'forget to wear protective eyeware'
</p>

Note to user   NOTE:  If you experience other syntax differences or issues, contact your account's Customer Success Manager Representative for guidance.

DekiScript/HTML Best Practices:

  • Add multiple DekiScript blocks as close together as possible on a page or use one block for all custom code (make sure to do the same for your CSS and JavaScript).
  • All code done in DekiScript blocks, NOT in the source of a given page.
  • Insert comments before substantial code blocks to explain the purpose.
  • Was this article helpful?