Jomatter

How to Add HTML to a Lioden Profile

You can add HTML to a Lioden profile by going to your den page, opening Edit Your Details, and placing the supported HTML code in the Territory Description field. Lioden allows HTML in territory descriptions, and players commonly use it for custom text, links, images, and profile layouts. 

The important point is that you should not paste a complete HTML webpage such as <html>, <head>, and <body>. Lioden’s profile field is a content area, so you normally paste the HTML elements you actually need.

Where to add HTML on Lioden

First, open your main Lioden den/profile page.

Scroll down to the Edit Your Details section. Find the Territory Description field. This is the area used for the content and custom HTML associated with your den page. Lioden community guides consistently identify this field as the place to insert profile HTML and CSS-related code. 

Paste your HTML into the Territory Description field and save your changes.

For example:

<h2>Welcome to My Den</h2>

<p>This is my Lioden profile.</p>

After saving, the browser can render the heading and paragraph rather than showing the tags as plain text.

Add bold, italic, and larger text

You can use supported HTML formatting directly in the Territory Description.

For example:

<b>Bold text</b>

<i>Italic text</i>

<u>Underlined text</u>

You can also use font sizing supported by Lioden’s profile system. A Lioden community guide documents the use of the font element with sizes from 1 through 7. 

Example:

<font size=”5″>My Lioden Profile</font>

However, you should use only the HTML that Lioden accepts. Normal browser HTML support does not mean every HTML element or attribute will work inside Lioden.

Add an image to your Lioden profile

You can also add an image by using an image URL with an <img> element.

Example:

<img src=”https://example.com/my-image.png” alt=”My Lioden image”>

Replace the example URL with the direct URL of your image.

For example:

<img src=”https://example.com/lion.png” alt=”My lion”>

Lioden community tutorials specifically describe adding artwork by placing image HTML in the Territory Description. 

Make sure the image URL actually points to the image file or an image-serving URL. If the host does not provide a usable image URL, the image may not appear.

Add a clickable link

You can create links using an anchor element:

<a href=”https://example.com”>My Website</a>

This produces clickable text instead of displaying the full URL.

You can also combine links with other content:

<p>

<a href=”https://example.com”>My Website</a>

</p>

Some premade Lioden layouts use this same approach for navigation links inside custom den designs. Current Lioden community CSS/HTML examples show links being placed directly into the profile layout. 

Center an image or text

You may also want to center content.

A simple option is:

<div style=”text-align:center;”>

    <img src=”https://example.com/lion.png” alt=”My lion”>

</div>

Or:

<div style=”text-align:center;”>

    <h2>My Den</h2>

    <p>Welcome!</p>

</div>

Whether a particular inline style works depends on what Lioden permits in its profile environment. When a style does not work, the usual solution is to put the styling into the custom CSS rather than trying to force everything through inline HTML.

Add CSS to your Lioden profile

This is where Lioden customization becomes more powerful.

HTML controls the content and structure, while CSS controls appearance such as backgrounds, colors, spacing, fonts, borders, and layout. Lioden community documentation explains that custom CSS is normally stored in an external stylesheet and then linked from the Territory Description using a <link> element. 

A typical CSS link looks like:

<link rel=”stylesheet” type=”text/css” href=”https://example.com/style.css”>

You would replace the example URL with the URL of your own CSS file.

The Lioden community guide specifically describes adding the stylesheet link in Territory Description under the profile’s editing section. 

This is the basic relationship:

HTML = content and structure

CSS = appearance and design

For example, your HTML could contain:

<h2 class=”title”>Welcome to My Den</h2>

<p class=”intro”>Thanks for visiting!</p>

And your external CSS could contain:

.title {

    text-align: center;

}

.intro {

    text-align: center;

}

The HTML creates the content, while the CSS controls how it looks.

Use a premade Lioden CSS layout

You do not have to build everything from scratch.

Many Lioden players publish free or commission-based CSS layouts that include HTML sections designed for the Territory Description. A current Lioden example from 2026 explicitly states that its CSS can be used on dens and that HTML is allowed alongside it. 

The usual process is:

  1. Choose a Lioden layout.
  2. Copy the provided HTML/CSS instructions.
  3. Open your den.
  4. Scroll to Edit Your Details.
  5. Open Territory Description.
  6. Paste the layout code.
  7. Replace placeholder text with your own content.
  8. Save the profile.

Premade layouts often include placeholders such as:

About Me

or:

text here

You can replace those placeholders with your own information. Current Lioden layout instructions describe this exact workflow for editing premade CSS/HTML templates. 

Why some Lioden HTML examples contain asterisks

When you see Lioden tutorials showing code like:

<*b*>Bold text<*/b>

the asterisks are generally being used in forum posts to stop the example code from being interpreted as active HTML.

For actual HTML that you are putting into the appropriate profile field, the working code would normally be:

<b>Bold text</b>

This distinction is important when copying code from Lioden forum tutorials. One Lioden guide explicitly tells readers to remove the asterisks before using the HTML. 

What if the HTML does not work?

If your code does not work, check the following:

First, make sure you are using the Territory Description field. The main den profile customization is associated with the editing section at the bottom of the den page. 

Second, check whether you copied escaped tutorial code. Remove the * characters that were added to prevent HTML from rendering in forum posts.

Third, check your image URL. An image element will not display anything if the URL is invalid or inaccessible.

Fourth, separate HTML from CSS. Some customization requires an external CSS file. Putting CSS rules directly into the Territory Description is not the same as loading a stylesheet. Lioden customization guides commonly use an external .css file linked through HTML. 

Fifth, use the layout’s instructions exactly. A premade CSS layout may depend on specific class names, HTML structure, or a specific stylesheet URL. Removing part of the supplied code can break the design. Lioden layout creators often provide instructions to copy the complete template into Territory Description. 

HTML for a simple Lioden profile

Here is a basic example you can adapt:

<h2>Welcome to My Den</h2>

<p>Welcome to my Lioden profile!</p>

<p>

    <b>Goals:</b> Breed beautiful lions and grow my pride.

</p>

<p>

    <a href=”https://example.com”>My Website</a>

</p>

<img src=”https://example.com/lion.png” alt=”My lion”>

Paste the supported code into your Territory Description, replace the example text and URLs, then save.

For a more advanced appearance, use an external CSS stylesheet and link it from the Territory Description rather than trying to put an entire website’s HTML and CSS into the profile.

Final answer

To add HTML to a Lioden profile, go to your Den → Edit Your Details → Territory Description, paste supported HTML into the Territory Description field, and save it. You can use HTML for text, links, images, and parts of custom layouts. For full visual customization, Lioden users commonly combine HTML in the Territory Description with an external CSS stylesheet.

Related More Guides

How To Link An Email In Html
How To Open A Link In A New Tab Html
How To Upload Html File To WordPress
How To Add Schema Markup To Html
How To Call A Function In Javascript From Html
How To Center An Iframe In Html
How To Change Plain Text Email To Html
How To Make Text Wrap Around An Image In Html
Are Html And Css Programming Languages
Do My Html Homework
How To Add Alt Tags To Images In Html
How To Create Multiple Web Pages In Html
How To Import An Html File Into Excel
How To Integrate WordPress Blog Into Html Website
How To Link A Css File To An Html File
How To Make More Than One Page In Html
How To Add Html Signature To Apple Mail
How To Add Textures In Html Games
How Do You Indent In Html
How Long Does It Take To Learn Html