The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Changing Text Styles and adding Glow Hovering effect

View previous topic View next topic Go down

Solved Changing Text Styles and adding Glow Hovering effect

Post by Cell Tennyson on July 5th 2014, 7:05 pm

Hi Again!! Smile

How do change all the regular text in my forum to something bold and stylish which will appear appealing?? See below:-


Another thing is that i want to add glow effect to the link texts and the buttons like "post reply" and all in my forum just like here in forumotions??

Examples:-

Cell Tennyson
Forumember

Male Posts : 102
Reputation : 1
Language : English

http://gtamr.forumotion.net/

Back to top Go down

Solved Re: Changing Text Styles and adding Glow Hovering effect

Post by Ange Tuteur on July 5th 2014, 10:04 pm

Hello Cell Tennyson,

You can change the main font here :
Display > Colors > Main Font Face

To add a glow to texts you can use the property text-shadow.

For links add the following to your CSS :
Code:
a:hover { text-shadow:0 0 6px #F00; }

for inputs you can use box-shadow :
Code:
input:hover, input:focus { box-shadow:0 0 6px #F00; }

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2683
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Changing Text Styles and adding Glow Hovering effect

Post by TheShaka on July 5th 2014, 10:17 pm

@Ange Tuteur wrote:
for inputs you can use box-shadow :
Code:
input:hover, input:focus { box-shadow:0 0 6px #F00; }

Ange is posible to add this effect on quote,edit,delete,etc... option

TheShaka
Forumember

Male Posts : 413
Reputation : 6
Language : polish

http://seiya.forumotion.com

Back to top Go down

Solved Re: Changing Text Styles and adding Glow Hovering effect

Post by Cell Tennyson on July 6th 2014, 7:22 am

Thanks Mr Ange Tuteur Smile

But how to increase the glow spread and its intensity??
Also some of the links type text are not glowing like "moderate this forum" , "overall top 20 posters" i want all the link type texts to glow when highlighted..

Cell Tennyson
Forumember

Male Posts : 102
Reputation : 1
Language : English

http://gtamr.forumotion.net/

Back to top Go down

Solved Re: Changing Text Styles and adding Glow Hovering effect

Post by SLGray on July 6th 2014, 7:52 am

By changing this part:

Code:
0 0 6px

Just playing around with it:

Code:
10px 0 6px
Code:
0 5px 6px


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 35641
Reputation : 2374
Language : English
Location : United States

http://fmthemes.forumotion.com/

Back to top Go down

Solved Re: Changing Text Styles and adding Glow Hovering effect

Post by Cell Tennyson on July 6th 2014, 8:15 am

What about some of the link type text are not glowing? like "moderate this forum" , "overall top 20 posters" I want all the link type text to glow when highlighted.

Cell Tennyson
Forumember

Male Posts : 102
Reputation : 1
Language : English

http://gtamr.forumotion.net/

Back to top Go down

Solved Re: Changing Text Styles and adding Glow Hovering effect

Post by Ange Tuteur on July 7th 2014, 6:16 am

@TheShaka wrote:Ange is posible to add this effect on quote,edit,delete,etc... option
Hi ! It would be best if you open a new topic for your query. Wink

@Cell Tennyson wrote:What about some of the link type text are not glowing? like "moderate this forum" , "overall top 20 posters" I want all the link type text to glow when highlighted.
add important to the end of the declaration :
Code:
a:hover { text-shadow:0 0 6px #F00 !important; }

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2683
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Changing Text Styles and adding Glow Hovering effect

Post by Cell Tennyson on July 7th 2014, 7:39 am

Thanks Mr Ange Tuteur!! Smile

But still the glow effect is not so dark its very light can that be increased Css?? I'm trying all possible colors i can but still the glow effect is very light. :'(

Cell Tennyson
Forumember

Male Posts : 102
Reputation : 1
Language : English

http://gtamr.forumotion.net/

Back to top Go down

Solved Re: Changing Text Styles and adding Glow Hovering effect

Post by Ange Tuteur on July 7th 2014, 11:30 am

I'm not exactly sure what you want, you'll have to modify the values.

Ex :
text-shadow: 0px = horizontal offset 0px = vertical offset 6px = softness #F00 = color;
Code:
text-shadow:0px 0px 6px #F00;

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2683
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Changing Text Styles and adding Glow Hovering effect

Post by Cell Tennyson on July 8th 2014, 7:59 am

Still The text are not glowing properly. The glow spread is not much and its very light even when on using different colors.. ConfusedCrying or Very sad Sad

Here is my forum you will understand my problem.
http://gtamr.forumotion.net/

Cell Tennyson
Forumember

Male Posts : 102
Reputation : 1
Language : English

http://gtamr.forumotion.net/

Back to top Go down

Solved Re: Changing Text Styles and adding Glow Hovering effect

Post by Ange Tuteur on July 8th 2014, 7:15 pm

You have the softness at 20px :
Code:
a:focus, a:hover {
  text-shadow: 1px 1px 20px #FAFFA5 !important;
}

Try bringing it down to 4 or 6px.

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2683
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Changing Text Styles and adding Glow Hovering effect

Post by Cell Tennyson on July 9th 2014, 8:37 pm

Ok Now its glowing a little bit!! Smile :wouhou:

Thanks Mr Ange Tuteur for your constant support... Smile

Cell Tennyson
Forumember

Male Posts : 102
Reputation : 1
Language : English

http://gtamr.forumotion.net/

Back to top Go down

Solved Re: Changing Text Styles and adding Glow Hovering effect

Post by Ange Tuteur on July 10th 2014, 1:33 am

You're welcome ^^

Topic archived

If you have anymore questions, do not hesitate to open a new topic. Have a good day ! Smile

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2683
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum