FontAwesome Icons in Visitor Tab & Account Wrapper

FontAwesome Icons in Visitor Tab & Account Wrapper

Overview Updates (21) Reviews (17) Discussion
Luxus said:
The best way to do this is with TMS. Via click you can disable and enable icons and easily change them.
Click to expand...

If you have Social Beta 2 installed, then this will not work with TMS. You have to disable the Social add-on for the TMS edit to take.
 
Nice resource.

Just a pity we couldn't do this via css which I did take a look at about a year or so ago to do exactly this.
 
For those of you wanting to add an image to the "Log Out" area, to make it all look uniform (OCD)....

Here is the TMS edit.

navigation_visitor_tab ---> find:
Code: 
<ul class="col2 blockLinksList">
                    <li><a href="{xen:link logout, '', '_xfToken={$visitor.csrf_token_page}'}" class="LogOut">{xen:phrase log_out}</a></li>
                </ul>

---> replace:
Code: 
<ul class="col2 blockLinksList">
                    <li><a href="{xen:link logout, '', '_xfToken={$visitor.csrf_token_page}'}" class="LogOut"><i class="icon-off icon-large icon-fixed-width" style="padding-right:8px;"></i>{xen:phrase log_out}</a></li>
                </ul>

Result
logout.webp
 
For Post Ratings
Edit the dark_postrating_navigation_visitor_tab and change it to
Code: 
<li><a href="{xen:link account/ratings-received}"><i class="icon-smile icon-large" style="padding-right:7px; color:black"></i>{xen:phrase dark_ratings_received}</a></li>
<li><a href="{xen:link account/ratings-given}"><i class="icon-thumbs-up icon-large" style="padding-right:7px; color:black"></i>{xen:phrase dark_ratings_given}</a></li>
Edit the dark_postrating_account_wrapper and change to
Code: 
<li><a class="{xen:if "{$selectedKey} == 'alerts/ratingsReceived'", 'secondaryContent', 'primaryContent'}" href="{xen:link account/ratings-received}"><i class="icon-smile icon-large" style="padding-right:7px; color:white"></i>{xen:phrase dark_ratings_youve_received}</a></li>
<li><a class="{xen:if "{$selectedKey} == 'alerts/ratingsGiven'", 'secondaryContent', 'primaryContent'}" href="{xen:link account/ratings-given}"><i class="icon-thumbs-up icon-large" style="padding-right:7px; color:white"></i>{xen:phrase dark_ratings_youve_given}</a></li>
If you don't want them colorized, remove the color:xxx from the style=" section.
 
stewart1champ said:
For those of you wanting to add an image to the "Log Out" area, to make it all look uniform (OCD)....

Here is the TMS edit.

navigation_visitor_tab ---> find:
Code: 
<ul class="col2 blockLinksList">
                    <li><a href="{xen:link logout, '', '_xfToken={$visitor.csrf_token_page}'}" class="LogOut">{xen:phrase log_out}</a></li>
                </ul>

---> replace:
Code: 
<ul class="col2 blockLinksList">
                    <li><a href="{xen:link logout, '', '_xfToken={$visitor.csrf_token_page}'}" class="LogOut"><i class="icon-off icon-large icon-fixed-width" style="padding-right:8px;"></i>{xen:phrase log_out}</a></li>
                </ul>

Result
View attachment 46873
Click to expand...

stewart1champ, could you share an xml dump of your settings here. This stuff has always made my head hurt.
 
stewart1champ said:
How would I go about doing that?

I didn't edit these in the Master Style, only my site theme.
Click to expand...

Good question. I've seen others do it like (CyberAP sharing sub forum grid listing xml). Now when I look at the panel there is no export tool (or is there)?
 
yavuz said:
Good question. I've seen others do it like (CyberAP sharing sub forum grid listing xml). Now when I look at the panel there is no export tool (or is there)?
Click to expand...

I think because it is done in the master style. I'll check with debug on.
 
Thank for this tweak, very nice

When adding the code for Bookmarks, it destroy my template (it reduce all the fonts in the menu)
 
kankan said:
Thank for this tweak, very nice

When adding the code for Bookmarks, it destroy my template (it reduce all the fonts in the menu)

Go to bookmarks_navigation_visitor_tab_links2 and replace everything with:
Code:
<li><a href="{xen:link account/bookmarks}"><i class="icon-bookmark icon-large" style="padding-right:6px;">{xen:phrase bookmarks_your_bookmarks}</a></li>
Go to bookmarks_account_wrapper_sidebar_your_account and replace everything with:
Code:
<li>
<a class="{xen:if "{$selectedKey} == 'account/bookmarks'", 'secondaryContent', 'primaryContent'}"
href="{xen:link account/bookmarks}"><i class="icon-bookmark icon-large icon-fixed-width" style="padding-right:7px;">{xen:phrase bookmarks_bookmarks}</a>
</li>
Click to expand...


You forgot the </i> after "padding-right:6px;"> and before {xen:phrase boo

Also, the top one needs to have be:
<i class="icon-bookmark icon-large icon-fixed-width" style="padding-right:7px;"></i>
 
Hi stewart1champ
Thank you.
@Yolulz : change your code on front page addon for bookmarks to :

Code: 
<li>
<a class="{xen:if "{$selectedKey} == 'account/bookmarks'", 'secondaryContent', 'primaryContent'}"
href="{xen:link account/bookmarks}"><i class="icon-bookmark icon-large  icon-fixed-width" style="padding-right:7px;"></i>{xen:phrase bookmarks_bookmarks}</a>
</li>

Missing <i> and no use [SIZE] balise.

@Stewart1champ, did you find a suitable picture for Poke ?
I am also lookin for XenMedio (Your video)
 
You must log in or register to reply here.

Similar threads

Chernabog
  • Question Question
XF 2.2 "Your Content" under visitor tab account returns no permission to view content
Replies
11
Views
790
Chernabog
Chernabog
Top Bottom