adding buttons to prosilve special adition

General topics relating to phpBB3 to be posted in here.
Post Reply
actionx
Forum Member
Forum Member
Posts: 1
Joined: Thu Jul 28, 2011 12:46 pm

adding buttons to prosilve special adition

Post by actionx »

hi how can i ad buttons to my header like this forum i have prosilve special adition+portal
User avatar
cisco007
Staff
Staff
Posts: 501
Joined: Tue Oct 07, 2008 3:44 am

Re: adding buttons to prosilve special adition

Post by cisco007 »

exactly which buttons are you talking about?
alfred123
Forum Member
Forum Member
Posts: 1
Joined: Mon Sep 26, 2011 7:15 am

Re: adding buttons to prosilve special adition

Post by alfred123 »

At the top of the page you have the Control Panel, FAQ, mChat, Members, ...
When you click on members it will open up a different page with the members list in it.

Now I want to create my own button that will also open a new page with html text into it.

Can someone explain to me how to create this?
User avatar
cisco007
Staff
Staff
Posts: 501
Joined: Tue Oct 07, 2008 3:44 am

Re: adding buttons to prosilve special adition

Post by cisco007 »

if you are talking about creating a new page, look here:
http://www.phpbb.com/kb/article/add-a-n ... -to-phpbb/

and to add the icons:
To add your own image you will have to use an image that has the width and height of 16 x 16 pixels maximum.

in case you don't understand what it is it's when you add an image to extra links in the navbar like

Code: Select all

<li class="icon-your-icon">link here</li>
you will open up yourstyle/template/overall_header.html and find:

Code: Select all

<li class="icon-faq"><a href="{U_FAQ}" title="{L_FAQ_EXPLAIN}">{L_FAQ}</a></li>
and add your link i stated above either above or below this line! and do the next steps!
Here is how to add your own image:
Place you image in styles/your_style/theme/images
Open: styles/your_style/theme/buttons.css

Find:

Code: Select all

.icon-bookmark, .icon-bump, .icon-subscribe, .icon-unsubscribe, .icon-pages, .icon-search
Add After:

Code: Select all

, .icon-your-icon
change the icon-your-icon to the name of your icon, So its like icon-picture.

Open: styles/your_style/theme/colours.css

Find:

Code: Select all

    .icon-search               { background-image: url("{T_THEME_PATH}/images/icon_search.gif"); }
Add After

Code: Select all

    .icon-your-icon               { background-image: url("{T_THEME_PATH}/images/icon_your_icon.gif"); }
Open: styles/your_style/theme/bidi.css
Find:

Code: Select all

 /* Icon images
    ---------------------------------------- */
    .rtl .sitehome, .rtl .icon-faq, .rtl .icon-contact, .rtl .icon-members, .rtl .icon-home, .rtl .icon-ucp, .rtl .icon-register, .rtl .icon-logout,
    .rtl .icon-bookmark, .rtl .icon-bump, .rtl .icon-mini_register, .rtl .icon-subscribe, .rtl .icon-unsubscribe, .rtl .icon-pages, .rtl .icon-search
After Add:

Code: Select all

, .rtl .icon-your-icon

Your better off having your image as a gif, You will also have to name it icon_youriconname

After wards you will have to refresh your template and your theme. To do this you need to login into your Administrator Control Panel (ACP) then go to Styles > Go on Template/Themes > then click on Refresh on your style that you have just edited.
User avatar
shadowslight
Forum Member
Forum Member
Posts: 35
Joined: Mon May 07, 2012 12:20 am

Re: adding buttons to prosilve special adition

Post by shadowslight »

Oh so that's the trick! I had done a trial and error way of finding this out by editing overall_header.html and with that I was only able to place links, not images
User avatar
cisco007
Staff
Staff
Posts: 501
Joined: Tue Oct 07, 2008 3:44 am

Re: adding buttons to prosilve special adition

Post by cisco007 »

yeah, well i mean you can also use the html img src tag in the overall_header.html, but this is using the normal phpbb template way!
User avatar
shadowslight
Forum Member
Forum Member
Posts: 35
Joined: Mon May 07, 2012 12:20 am

Re: adding buttons to prosilve special adition

Post by shadowslight »

I wasn't aware of this. But then again I'm self taught. Through a lot of trial and error. But for some reason, I never was able to get the img tag to work right. Perhaps it was the then broken html knowledge :lol:
Post Reply