News:

SMF 2.1.4 has been released! Take it for a spin! Read more.

Main Menu

Different coloured tabs

Started by petewadey, July 20, 2016, 02:15:30 AM

Previous topic - Next topic

petewadey

Quote from: Grammy on July 21, 2016, 08:10:31 AM
Yes, if you use THIS MOD, your button name is paypal, not Donations. 

You're using Core, you said, so that has its own index.css.

So in Themes/Core/index.css you would put something like this:

#button_paypal {
color:#f7cb06;}

Tried that, still nothing. I tried it on my site in Modify Themes and clicked Preview and nothing had changed.Should I be able to do it there or do I need to go into my control panel and do it from there?

Grammy

Quote from: petewadey on July 21, 2016, 12:10:40 PM
Quote from: Grammy on July 21, 2016, 08:10:31 AM
Yes, if you use THIS MOD, your button name is paypal, not Donations. 

You're using Core, you said, so that has its own index.css.

So in Themes/Core/index.css you would put something like this:

#button_paypal {
color:#f7cb06;}

Tried that, still nothing. I tried it on my site in Modify Themes and clicked Preview and nothing had changed.Should I be able to do it there or do I need to go into my control panel and do it from there?


No, you would need to add it manually to your index.css file and then upload it to your server to Themes/Core/css. (Or yes, you can edit the file from within your CP.)  Do you want to attach that index.css file and let me add the code for you?  (But I know you can do it!)   ;)

petewadey

I might take you up on that offer, but I won't give up just yet. It might take me a while, but I'll get there. Thanks

Grammy

Quote from: petewadey on July 21, 2016, 12:22:08 PM
I might take you up on that offer, but I won't give up just yet. It might take me a while, but I'll get there. Thanks

You'll get it!   ;)

Kindred

1- you should generally NOT use the editor in the smf admin. It is there for emergencies, but is not the correct way to really work on files.
2- changing CSS will probably not show up in preview...  usually, you will need to use a HARD-reset of the cache (ctrl-f5) to see the changes after saving the file.
3- oops...  you are using the "core" theme?   UGH!   kill that. kill it with fire.    In that theme, I think the button background might actually be an image, not CSS...   which means that CSS changes will never work.   Seriously - get a better theme - the Core theme is just about 10 years old at this point, it uses tables everywhere, it is not responsive...  it is actually terrible.
Слaва
Украинi

Please do not PM, IM or Email me with support questions.  You will get better and faster responses in the support boards.  Thank you.

"Loki is not evil, although he is certainly not a force for good. Loki is... complicated."

Grammy

Quote from: Kindred on July 21, 2016, 01:09:41 PM
1- you should generally NOT use the editor in the smf admin. It is there for emergencies, but is not the correct way to really work on files.
2- changing CSS will probably not show up in preview...  usually, you will need to use a HARD-reset of the cache (ctrl-f5) to see the changes after saving the file.
3- oops...  you are using the "core" theme?   UGH!   kill that. kill it with fire.    In that theme, I think the button background might actually be an image, not CSS...   which means that CSS changes will never work.   Seriously - get a better theme - the Core theme is just about 10 years old at this point, it uses tables everywhere, it is not responsive...  it is actually terrible.


Core uses images?   ???

Ugh, scratch that.  Better fire up the Photoshop. 

Grammy

Pete, have you considered trying the Curve (default) theme?  It'll look much nicer and the mods are made for it.  The buttons are CSS, instead of images, so you can change them easily.   :)

petewadey

Is it easy to change to curve and back gain if I don't like it? The change may confuse my elderly membership  :-\

Kindred

yes... just change it in the admin and then change it back if you don't want it. (curve = default)

However, regardless of your elderly membership, you really need to get rid of Core.
Слaва
Украинi

Please do not PM, IM or Email me with support questions.  You will get better and faster responses in the support boards.  Thank you.

"Loki is not evil, although he is certainly not a force for good. Loki is... complicated."

petewadey

Ok I've tried curve and really don't like it, so looks like I have to keep buttons as they are  :(
I'll wait for a donate by paypal mod to turn up that has it's own independent button. Thanks for all you help and patience.
Pete

Grammy

Quote from: petewadey on July 21, 2016, 03:11:12 PM
Ok I've tried curve and really don't like it, so looks like I have to keep buttons as they are  :(
I'll wait for a donate by paypal mod to turn up that has it's own independent button. Thanks for all you help and patience.
Pete


Change is shocking at first, sometimes.  This SMF forum is Curve, so you should be used to seeing it, but your forum is your forum, so I can understand that.  You might consider a custom button, that you can put in the header (for instance, where you currently have the SMF logo).  But it would take a little custom work for that.  (I would have loved to see your forum in Curve before you changed it back.)   :)

(If it's the width that bothers you, you can adjust that in Admin to the width you want.)

Kindred

Pete....    please note that the buttons ARE all independent, even in Core...   they just use a background IMAGE - So, as long as you use the Core theme, you will never be able to change it for just one button
Слaва
Украинi

Please do not PM, IM or Email me with support questions.  You will get better and faster responses in the support boards.  Thank you.

"Loki is not evil, although he is certainly not a force for good. Loki is... complicated."

Grammy

Quote from: Kindred on July 21, 2016, 03:23:26 PM
Pete....    please note that the buttons ARE all independent, even in Core...   they just use a background IMAGE - So, as long as you use the Core theme, you will never be able to change it for just one button


I wonder, if he feels that strongly about keeping Core, if he could utilize the image class where the SMF logo is and edit it for a regular Paypal button?

<img class="floatright" id="smflogo" src="http://bsac10c11c12.co.uk/smf/Themes/core/images/smflogo.gif" alt="Simple Machines Forum">

(You can tell I have nothing to do today, ha.)   :D

Kindred

Yeah, I was right...   Core uses

.main_menu li.active a span em {
    background: rgba(0, 0, 0, 0) url("../images/maintab_active_back.gif") repeat-x scroll right bottom;
    display: block;
    font-style: normal;
    padding: 0.1em 0.5em 0.5em;
}


it actually uses images for the background and additional images for the right and left sides of the button....

in short, changing any single button would be complicated, at best.

Слaва
Украинi

Please do not PM, IM or Email me with support questions.  You will get better and faster responses in the support boards.  Thank you.

"Loki is not evil, although he is certainly not a force for good. Loki is... complicated."

Grammy

Quote from: Grammy on July 21, 2016, 03:32:50 PM

I wonder, if he feels that strongly about keeping Core, if he could utilize the image class where the SMF logo is and edit it for a regular Paypal button?

<img class="floatright" id="smflogo" src="http://bsac10c11c12.co.uk/smf/Themes/core/images/smflogo.gif" alt="Simple Machines Forum">

(You can tell I have nothing to do today, ha.)   :D

Something like the screenshots?   (And just lose the other button.)  Also, if it were me, I'd modify the PP button to something a little less "in your face", but that's just me. 


*laughing because Pete has ridden off into the sunset...*   Okay, I need to close my laptop and get up and move around!

oOo--STAR--oOo

#35
Because of the themes design, its not that simple to edit just that individual button on its own because it is originally styled using images.. Anyway I gave it an attempt and its looking pretty decent. I just used orange as en example, change the colour to what you wish!

Here is what you need to add at the end of your /smf/Themes/core/css/index.css file.


li#button_paypal.active a span {
    border: 0;
    box-shadow: none;
    background: none;
}
li#button_paypal.active a {
    background: #ff9400;
    padding: 0px 7px 0px 0px;
    height: 17px;
    border: 1px solid #000;
    border-radius: 0px 0px 6px 6px;
    border-top: 0;
    padding-top: 1px;
    box-shadow: 0px 0px 3px #000;
    box-shadow: inset 1px -1px 0px #fff, inset -1px -1px 0px #fff;
}
li#button_paypal a span {
background: #ff9400;
    border-bottom: 1px solid #000;
    margin-bottom: -5px;
    height: 11px;
    box-shadow: inset 0px -1px 0px #fff;
}


Its looking exactly the same as the image background, but styled with css.. To change the colour of the background simply change the background: #ff9400; which is listed twice. One of for when is for active/current page, the other is for when its not active.

Normal
http://imgur.com/lFF3UKc

active state

http://imgur.com/1y3Yvex

Enjoy!


NEVER SAY NEVER! You just need to know what you are doing, anything is possible!
You can't fool a sufficiently talented fool.

http://www.uniquez-home.com
In Design Phase!

Mods I am designing,  No refresh Collapse Categories , Poll Redesign , Pure CSS Breadcrumb , Profile Statuses, Profile Views.

Grammy

The pics show it to be on Pete's site, but when I click the link to his forum, I don't see any change.   :-\

Is that Photoshopped to depict what it would look like?

oOo--STAR--oOo

Quote from: Grammy on July 21, 2016, 05:26:49 PM
The pics show it to be on Pete's site, but when I click the link to his forum, I don't see any change.   :-\

Is that Photoshopped to depict what it would look like?

The changes have not been applied, that's up to him to apply the changes by putting the CSS I have posted in his index.css file.

I was previewing what the changes will look like on his forum when he has added that css.. No its not photo shopped its a live edit. Go ahead and insert that css on his site and see :)
You can't fool a sufficiently talented fool.

http://www.uniquez-home.com
In Design Phase!

Mods I am designing,  No refresh Collapse Categories , Poll Redesign , Pure CSS Breadcrumb , Profile Statuses, Profile Views.

Grammy

Quote from: Twin_Future on July 21, 2016, 06:57:13 PM
Quote from: Grammy on July 21, 2016, 05:26:49 PM
The pics show it to be on Pete's site, but when I click the link to his forum, I don't see any change.   :-\

Is that Photoshopped to depict what it would look like?

The changes have not been applied, that's up to him to apply the changes by putting the CSS I have posted in his index.css file.

I was previewing what the changes will look like on his forum when he has added that css.. No its not photo shopped its a live edit. Go ahead and insert that css on his site and see :)


Whoa!!  You threw me off with that new nickname!  It's not nice to do that to old people!   :o

No, just wondered if you'd implemented it, because I knew you had registered there.  That's why I asked. 

Kindred

I never said never..  I said it would be complicated...  and there are many other issues with the core theme
Слaва
Украинi

Please do not PM, IM or Email me with support questions.  You will get better and faster responses in the support boards.  Thank you.

"Loki is not evil, although he is certainly not a force for good. Loki is... complicated."

Advertisement: