Search the Community

For some the character mods centering isn't exactly what they were looking for this guide is a means to show you that some minor alterations can make a big difference. So the first thing you're going to edit is the Mini Profile which is in characters > front > character > AuthorPane Search for: <li class="ipsType_light">{lang="character_owner"}: {$character->owner()->link()|raw}</li> {{foreach $character->customFieldsForDisplay( 'topic' ) as $field}} {{if !empty( $field['value'] )}} <li> {$field['title']}: {$field['value']|raw} </li> {{endif}} {{endforeach}} The title is the title of the field and the value is the what was entered. Now what I recommend is changing are a few things and by that I mean lets make it a details list instead of just a simple li. What you will do is change it to the following (note this includes changing the Player/owner so that it fits the scheme but is not required): <li> <dl class='charPane'> <dt>{lang="character_owner"}</dt> <dd>{$character->owner()->link()|raw}</dd> {{foreach $character->customFieldsForDisplay( 'topic' ) as $field}} {{if !empty( $field['value'] )}} <dt> {$field['title']}</dt> <dd>{$field['value']|raw} </dd> {{endif}} {{endforeach}} </dl> </li> From here it's just simple CSS to make the fields appear how you want. In the one I did the dt field is text-aligned left and the dd field is text-aligned right. We also probably want them on the same line so the following CSS accomplished all of that: .charPane { max-width: 275px; margin: 0 auto; } .charPane dt { width: 45%; display: inline-block; float: left; text-align: left; padding: 3px; font-weight: 700; } .charPane dd { width: 45%; display: inline-block; margin-left: 0; text-align: right; padding: 3px; } Mind you, your max-width should match what you have on your site so that it doesn't unintentionally overflow into the post. There is actually way more that you can do to make a very custom mini-profile just like on JCink (or here on the Initiative) and whatnot so look forward to another guide about it.