How to add extra register and login near header logo ?

**winwill** · 05-10-2012, 06:44 AM

i want to add register and login to websites header, after login it wants to be changed into logout

**Yankidank** · 05-10-2012, 11:41 PM

You won't get a response if you can't present a clear question.

**winwill** · 05-12-2012, 03:50 AM

ok....In my website register & login look like following image

Attachment 2599

i want to change that register & login into like following image

Attachment 2598

how can i do this ?

**winwill** · 05-12-2012, 03:51 AM

i dont want to change entire template just need to add it top right corner of the website

**mneodor87** · 05-12-2012, 09:07 PM

I got "Invalid Attachment specified" when I tried viewing the images, so I can't tell exactly what you'd like to be done, but here is how I customize my sites-

Using Chrome Developer Tools (guide here- https://developers.google.com/chrome.../docs/overview) or Firebug inspect the header logo/right corner on your page. What information can you find- does a specific CSS class or <div> id contain the logo image or the right corner? Find it and then go to your template's folder to edit the header.tpl file.

Find where you want the links to go in the header.tpl file and paste this code-

{if $user_authenticated neq true}
<a href='{$URL_login}'>{#PLIGG_Visual_Login_Title#}</a>
<a href='{$URL_register}'>{#PLIGG_Visual_Register#}</a>
{/if}

{if $user_authenticated eq true}<a href="{$URL_userNoVar}">{#PLIGG_Visual_Profile#}</a>{/if}
{if isset($isgod) && $isgod eq 1}<a href="{$URL_admin}">{#PLIGG_Visual_Header_AdminPan el#}</a>{/if}

{if $user_authenticated eq true} <a href="{$URL_logout}"> {#PLIGG_Visual_Logout#}</a>{/if}

This adds options for login, register, profile, Admin, and Logout links respectively. Because these are logic tests then when someone is logged in it will show the log out option, and when someone is logged out it will show the log in link like you wanted.

Now, once the code is in your header.tpl file, you will probably need to style it to make it look nice and align the way you want it, etc. on your page. After a hard refresh or two (CTRL+R on PC) again inspect the links with Developer Tools or Firebug and look at the <div> they're in. Play around with adding attributes like padding and margins, etc. to get the links where you want them and then style them with colors and the like. Once you like how it looks on the page, add those attributes/changes to your CSS file (Chrome Developer Tools is nice enough to tell you which line the specific class/id is on in your stylesheet to reduce time hunting for it).

Finally, you may need to put them in their own <div> so they don't conflict with the logo or other elements on the page. If that's the case then use CSS floats or positioning to get them to where you'd like them. Good luck!