There are several description fields within the NamePros Parking dashboard that support HTML, text formatting, and template variables (aka variable text), which are collectively referred to as "HTML enabled" in this guide. Understanding how to effectively use these fields will greatly increase the customization options you have available for your landers.
Short on time? Choose from existing templates that others have created.
We encourage you to share your own templates, too.
Tip: Copy and paste this entire guide into ChatGPT, and then ask AI to create your descriptions for you; AI will add the HTML formatting and variables to help bring your descriptions to life quickly and easily.
What does "HTML enabled" mean?
This label simply means that you can use HTML syntax within the field. This allows you to format the content of that field to your liking, such as making it bold, underlining it, or even adding lists, headers, and more!A course on what HTML is goes beyond the scope of this guide, but we will provide a brief introduction:
HTML is primarily compromised of "tags", similar to the BBCodes that you may be familiar with from the text editor you use to create and edit posts here on NamePros. Each tag results in a different display on your lander. For example, the
<b> tag will cause bold text. Generally, each tag begins with an opening tag (<b>) and ends with a closing tag (</b>). Any content of the tag (<b>Tag content!</b>) will receive the effects of the tag. In this case, that results in the display "Tag content!", as we used the <b> tag.For security and to ensure proper lander appearance, we only allow a small subset of HTML tags within the description fields, check below for a breakdown of what tags are allowed where. Attributes are currently not allowed for any tag. Disallowed tags and attributes are stripped from the HTML that will appear on your landers.
Where can I use HTML?
There are currently three HTML enabled fields, within the Short description, Expanded description, and Seller description options under the "Extras" section of your parking profile and the edit pages for domains. Each field has it's own requirements, which we will address below.The following tags can be used in any HTML enabled field:
| Tag | Result |
|---|---|
<b>Example Text</b>or <strong>Example Text</strong> | Example Text |
<i>Example Text</i>or <em>Example Text</em> | Example Text |
<u>Example Text</u> | Example Text |
<s>Example Text</s> | |
<mark>Example Text</mark> | |
<code>Example Text</code> | |
<a href="https://namepros.com">Example link</a> | Example link |
<a href="#heading">Jump to heading โ</a> | Jump to heading โ |
Link support
As shown above you can use links in any HTML enabled option, with several things to keep in mind:- All links are forced to use the HTTPS protocol (eg
https://). If a link is provided without it, then we replace the protocol (e.g.,http://becomeshttps://). Ensure the page you are linking to supports HTTPS. - If an invalid/unsupported link is used, then the anchor tag (
<a>) will not appear on your lander. - Linking to fragments (
#fragment) is supported.- This can be used to direct visitors to a particular area of your descriptions: Learn more.
- The expanded description can be linked to using the fragment
#description. Example:<a href="#description">See description</a> mailto:links are supported. Example:<a href="mailto:[email protected]?subject={domain}">Email us!</a>
Short description and Seller description
The short description option allows a small amount of text below the domain name heading, within the main domain name display. This field cannot use any additional HTML tags, has a max length of 150 characters (HTML tags do not count towards this limit), and only supports template variables inside of links because they could make the description too long outside of links.The seller description option works the same as the short description but appears under your user card on landing pages.
The above display is accomplished with the following HTML:
HTML:
Example short description with <i>simple</i> <b>formatting</b> <u>options</u>!Expanded description (long description)
The expanded description option allows for a large amount of text to appear in a separate description area, appearing below the main domain display.This field allows the usage of the following additional HTML tags:
<h1>Large heading</h1><h2>Smaller heading</h2><h3>Smallest heading</h3><p>Paragraph</p><hr />- Horizontal line<br />- Line break<ol><li>Ordered list</li></ol><ul><li>Unordered list</li></ul><li>List item</li>- Can only be used inside an ordered or unordered list.<img src="https://link-to-your-image" />- See additional notes below.<faq question="Is this an example question?">Yes! (This is an example answer.)</faq>- Insert a custom Frequently Asked Question<block>Display text in a styled block<block>- See additional notes below.<align-center>Center-aligned text and inline images</align-center><align-right>Right-aligned text and inline images</align-right><align-left>Left-aligned text and inline images</align-left>
{variable}.List of variables that can be used:
{domain}- Inserts the current capitalized domain name.{website}- The "Seller website" that you chose in your account settings.{domainUppercase}- The visited domain in all uppercase (e.g., EXAMPLE.COM for Example.Com).{domainLowercase}- The visited domain in all lowercase (e.g., example.com for Example.Com).{domainTLD}- The domain extension of the visited domain name (e.g., "Com" for Example.Com).{domainTLDUppercase}- The domain extension of the visited domain name, converted to uppercase (e.g., "COM" for Example.Com).{domainTLDLowercase}- The domain extension of the visited domain name, converted to lowercase (e.g., "com" for Example.Com).{domainLength}- The length of the visited domain name (e.g., 11 for Example.Com).{domainLengthWithoutTLD}- The length of the visited domain without its domain extension (e.g., 7 for Example.Com).{domainWithoutTLD}- The visited domain name without its domain extension. (e.g., "Example" for Example.Com){domainWithoutTLDUppercase}- The visited domain name without its domain extension, converted to uppercase. (e.g., "EXAMPLE" for Example.Com){domainWithoutTLDLowercase}- The visited domain name without its domain extension, converted to lowercase. (e.g., "example" for Example.Com)
Disable each line separately and keep text spacing
The expanded description contains an additional "Display each line separately and keep text spacing" option, which can be helpful if you don't want to structure your text using the tags above.
With it enabled then we will insert HTML tags to match the plain text structure you provide. This option is enabled by default, but it is highly recommended to disable it if you are familiar with HTML as it may result in an unexpected display.
Custom fragments for headings
<h1>, <h2>, and <h3> elements allow you to specify an id attribute to create your own fragments you can link to with anchors.
HTML:
<h1 id="heading">
Example heading
</h1>
<a href="#heading">Link to example heading</a>You can have multiple fragments on the same page, but you must choose a unique name for each ID. For each ID, use any name you'd like except "description" because that's already used on the page for the "Expanded description" area.
Important: See notes on link support.
Add images to your landers
The first step is to upload each image to a website that will provide you with a URL to that image, such as:- NamePros Parking: Add images to your account settings or specific domains.
- NamePros Forums: Attach images to a public thread or post on NamePros.
- Important: Copy and use the correct image address that includes namepros.com:
https://www.namepros.com/attachments/... - Do not use the incorrect image address that includes nameproscdn.com because it'll expire. Note: This incorrect image address appears in your browser's address bar after visiting the correct image address in #1.
- Important: Copy and use the correct image address that includes namepros.com:
- Other image hosting providers include:
- Postimage (copy "Direct link") [Recommended]
- ImgBB (select "HTML full linked" then remove the
<a ...>tags) - Freeimage.host (select "HTML full linked" then remove the
<a ...>tags) - Imgur (right-click image then "Copy Image Address")
<img src="url-of-image-here" /> tag. Therefore, if you want two images to appear one after the other, you could do this:
HTML:
<img src="url-of-image-1" />
<img src="url-of-image-2" /><img /> tags are used to display images on your landers, and there are several things to keep in mind when using them:- You should provide text describing the image in the
altattribute:<img src="..." alt="Photograph of puppy" /> - Images have a default styling that adds a border, rounds the corners, and adds a slight shadow. This styling can be disabled by adding the custom
unstyleattribute:<img src="..." unstyle /> - Images have a maximum displayed height of 600px. Images can take up the full width of the description area.
- The source of the image (in the
srcattribute) must be loaded over https. Any urls that do not use https will be automatically converted to it, which may prevent your image from loading if its host doesn't support https. - Image width in pixels can be set with the
widthattribute. Example:<img src="..." width="50" />will result in an image 50px wide. Images will not be resized to be wider than the available width.
display="align-center" is the default. Example: <img src="..." display="align-right" />img's display value | Description |
|---|---|
display="align-center" | Displays an image centered on its own line. |
display="align-left" | Displays an image to the left on its own line. |
display="align-right" | Displays an image to the right on its own line. |
display="full-width" | Displays an image on its own line and forces it to take up all available horizontal space. Important: The width attribute will override this! |
display="inline" | Displays an image on the same line as surrounding images and text. |
<block> tag
To allow some visual distinctions, we have a custom <block> tag that will wrap content in a visual block.
HTML:
<block>This is text wrapped in a default block</block>There are various themes that can be used with block tags. The default is dynamic, and is based of off the theme hue you have selected. There are 3 additional themes that can be used with the type attribute:
green, yellow, and red. You can use these colors for anything, such as green for bonuses, yellow for cautions, and red for important text.
HTML:
<block type="green">This is text wrapped in a green block</block>The above display is accomplished with the following HTML ("Display each line separately and keep text spacing" is not enabled):
HTML:
<h1>Ait enim se, si uratur, Quam hoc suave! dicturum.</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. <i>Quo igitur, inquit, modo?</i> Ille enim occurrentia nescio quae comminiscebatur; Summae mihi videtur inscitiae. Duo Reges: constructio interrete. </p>
<ol>
<li>Non quam nostram quidem, inquit Pomponius iocans;</li>
<li>Si longus, levis dictata sunt.</li>
<li>Utrum igitur tibi litteram videor an totas paginas commovere?</li>
<li>Nec enim, omnes avaritias si aeque avaritias esse dixerimus, sequetur ut etiam aequas esse dicamus.</li>
</ol>
<h2>Si longus, levis dictata sunt.</h2>
<ul>
<li>Ego quoque, inquit, didicerim libentius si quid attuleris, quam te reprehenderim.</li>
<li>Iam enim adesse poterit.</li>
<li>Qua ex cognitione facilior facta est investigatio rerum occultissimarum.</li>
<li>Qui autem de summo bono dissentit de tota philosophiae ratione dissentit.</li>
</ul>
<p>Inquit, dasne adolescenti veniam? A mene tu? <b>Quae cum magnifice primo dici viderentur, considerata minus probabantur.</b> Quid autem habent admirationis, cum prope accesseris? Hic nihil fuit, quod quaereremus. Inde igitur, inquit, ordiendum est. </p>Descriptions
The descriptions are optional: you can set any combination of them, such as all of them or none of them.Here's an example of using only the expanded description:
Bonus
By using an<img /> tag in your Expanded description, you can add other trackers or display a visitor counter on your landing pages if the service uses an image to count visits, such as:
Last edited by a moderator:
