Log in

View Full Version : Editing Profile tabs?


Xexiu
04-15-2013, 01:47 PM
Hello,

I had searched around google and vb org to edit the CSS of profile tabs and didn't found it anywhere.

On the profile template (MEMBERINFO) I found:

<div id="profile_tabs" style="padding-top: 20px;">
$template_hook[profile_left_first]
$blocks[visitor_messaging]
$blocks[aboutme]
$blocks[stats]
$blocks[friends]
$blocks[infractions]
$blocks[contactinfo]
$template_hook[profile_left_last]
</div>

What I want to do it to edit the "ul" part. Ex in firebug:

<div id="profile_tabs" style="padding-top: 20px;">
<ul class="tab_list" style="height: 29px;">
<li id="visitor_messaging_tab" class="tborder tcat" tab_id="visitor_messaging" fixed_width="133" style="width: 133px; display: block; background-position: 0px 0px;">Visitor Messages</li>
<li>etc..</li>
</ul>
</div>

I can't find anywhere the "<ul class="tab_list" style="height: 29px;">".

Anyone can land me a hand, please?

Thank you.

Lynne
04-15-2013, 03:09 PM
I believe the CSS for the profile tabs is in /clientscript/vbulletin_tabctrl.css

Xexiu
04-15-2013, 08:00 PM
Thank you for the info, Lynne!

I allready knewed about that. But it isn't what I'm looking for.
Let me explain myself. I want to edit the code and add my own CSS. For example:

I want to delete:

<ul class="tab_list" style="height: 29px;">

And add:

<ul style="my_code_here">

This is just an example. I want to know where I can find ALL the code that makes the tab function in order to edit it and remove some thing that I don't like. In Memberinfo template is only this:

<div id="profile_tabs" style="padding-top: 20px;">
$template_hook[profile_left_first]
$blocks[visitor_messaging]
$blocks[aboutme]
$blocks[stats]
$blocks[friends]
$blocks[infractions]
$blocks[contactinfo]
$template_hook[profile_left_last]
</div>

Is there anyway to edit the "entire" code?

Much thanks and apreciated for your answers!

blind-eddie
04-15-2013, 11:35 PM
I believe you will need to edit each of the blocks templates to reflect your <ul class
Search for MEMBERINFO, you will see all the memberinfo blocks.

Then edit /clientscript/vbulletin_tabctrl.css to add your css info

Lynne
04-16-2013, 03:23 AM
To find the template to modify, do this - vboptions > General Settings > Add Template Name in HTML Comments > set to Yes . Then go back to your page and view the source code and you will see the name of the template called around your part of the code. (Sometimes the template is the one mentioned at the very top of the page source.)

Once you turn that on, you can find the template you want to edit.

Xexiu
04-16-2013, 01:23 PM
Well, thank you Lynne.

Had to edit the js. file in order to remove some things. Let me explain how do I do it:
I had enabled HTML Comments and saw this:

<script type="text/javascript">
<!--
vBulletin.register_control("vB_TabCtrl", "profile_tabs", "", "&raquo;", "profile.php?u=2&do=loadtab&tabid={1:tabid}");
//-->
</script>

I didn't find what I was looking for (the template) cause it was called via vbulletin_tabctrl.js.
I downloaded the file from my server and make the following edits. Inside vbulletin_tabctrl.js
I searched for (depending on the customized style):

tborder tcat tab_header

And replace all the content with:

alt1

Now the result is this:

<div id="profile_tabs" style="padding-top: 20px;">
<ul class="tab_list" style="height: 29px;">
<li>...</li>
<li>...</li>
</ul>
<div class="alt1"></div> (was before: tborder tcat tab_header)


Also I was thinking of removing all the "div" from there, cause it makes no sense to stay there, but I'm not a javascript expert so I don't know how to remove it from vbulletin_tabctrl.js. Can you land me a hand?

Here is the function from .js file that I observed:

parentNode.insertBefore(document.createElement("div"),F[0]);YAHOO.util.Dom.addClass(B,"tborder tcat tab_header")} (now "alt1")

I don't know if I copied ALL the code that make the function. I will attach 2 versions of my vbulletin.tabctrl.js (one is the original and one is the modified).

P.D. Removing the "div" from the file, so after doing it, will reflect the changes on vistior tabs!