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.

Custom Font

View previous topic View next topic Go down

Solved Custom Font

Post by Asriel on May 24th 2013, 3:03 pm

Is it possible to add font like this to Phbb2 forum?



Last edited by Asriel on May 27th 2013, 12:13 am; edited 1 time in total

Asriel
Forumember

Male Posts : 583
Reputation : 30
Language : English, Russian, Ukrainian
Location : St. Somewhere

http://www.worldofmutants.forumotion.com

Back to top Go down

Solved Re: Custom Font

Post by Sir Chivas™ on May 24th 2013, 3:34 pm

Hi,

Can you provide the URL of the forum? I think there was a similar thread asking for this, let me search it.



Attention!
- Please provide your forum URL at all times.
- When the issue is solved, please mark it as solved.



Sir Chivas™
Support Moderator
Support Moderator

Male Posts : 6756
Reputation : 428
Language : English, Spanish, and French
Location : || CSS || HTML || Graphics Designs || Support ||

Back to top Go down

Solved Re: Custom Font

Post by Asriel on May 24th 2013, 4:13 pm


Asriel
Forumember

Male Posts : 583
Reputation : 30
Language : English, Russian, Ukrainian
Location : St. Somewhere

http://www.worldofmutants.forumotion.com

Back to top Go down

Solved Re: Custom Font

Post by Sir Chivas™ on May 24th 2013, 5:10 pm




Attention!
- Please provide your forum URL at all times.
- When the issue is solved, please mark it as solved.



Sir Chivas™
Support Moderator
Support Moderator

Male Posts : 6756
Reputation : 428
Language : English, Spanish, and French
Location : || CSS || HTML || Graphics Designs || Support ||

Back to top Go down

Solved Re: Custom Font

Post by Asriel on May 24th 2013, 5:30 pm

It doesn't seem to work for me.

Asriel
Forumember

Male Posts : 583
Reputation : 30
Language : English, Russian, Ukrainian
Location : St. Somewhere

http://www.worldofmutants.forumotion.com

Back to top Go down

Solved Re: Custom Font

Post by E-Mark on May 24th 2013, 10:02 pm

Hi Asriel!

Use a cufon, it will be more easy. Try the codes i've posted here: http://fmcoding-support.darkbb.com/t156-how-to-change-name-in-widget-with-image-font#952

E-Mark
Active Poster

Male Posts : 1389
Reputation : 164
Language : English, Tagalog
Location : Republic of the Philippines

http://coding-spot.darkbb.com/

Back to top Go down

Solved Re: Custom Font

Post by Asriel on May 24th 2013, 10:33 pm

I don't understand what do you mean by "remove all images from widgets" I cannot remove images from the original ones. Like, Recent Topics.

Asriel
Forumember

Male Posts : 583
Reputation : 30
Language : English, Russian, Ukrainian
Location : St. Somewhere

http://www.worldofmutants.forumotion.com

Back to top Go down

Solved Re: Custom Font

Post by E-Mark on May 24th 2013, 10:35 pm

Don't mind it since i'm referring it to the topic starter, just follow the step for putting the codes.

E-Mark
Active Poster

Male Posts : 1389
Reputation : 164
Language : English, Tagalog
Location : Republic of the Philippines

http://coding-spot.darkbb.com/

Back to top Go down

Solved Re: Custom Font

Post by Asriel on May 24th 2013, 10:54 pm

I did as instructed, but nothing happened. Here's a screenshot of what I did.


Asriel
Forumember

Male Posts : 583
Reputation : 30
Language : English, Russian, Ukrainian
Location : St. Somewhere

http://www.worldofmutants.forumotion.com

Back to top Go down

Solved Re: Custom Font

Post by E-Mark on May 24th 2013, 10:55 pm

Does the placement of your widget is set on the left side?

E-Mark
Active Poster

Male Posts : 1389
Reputation : 164
Language : English, Tagalog
Location : Republic of the Philippines

http://coding-spot.darkbb.com/

Back to top Go down

Solved Re: Custom Font

Post by Asriel on May 24th 2013, 11:06 pm

It's on both sides. Left and right. See portal.

Asriel
Forumember

Male Posts : 583
Reputation : 30
Language : English, Russian, Ukrainian
Location : St. Somewhere

http://www.worldofmutants.forumotion.com

Back to top Go down

Solved Re: Custom Font

Post by E-Mark on May 24th 2013, 11:12 pm

Ah, i see, so the widgets are in the portal, use this one instead:
Code:
<script src="http://cufon.shoqolate.com/js/cufon-yui.js" type="text/javascript"></script>
<script src="http://static.tumblr.com/hhedat8/TpQmmtm7s/hemi-head-426.cufonfonts.js" type="text/javascript"></script>
<script>
Cufon.replace('td.catLeft .module-title', { fontFamily: 'HemiHeadFourTwentySix-Regular', hover: true });
</script>

E-Mark
Active Poster

Male Posts : 1389
Reputation : 164
Language : English, Tagalog
Location : Republic of the Philippines

http://coding-spot.darkbb.com/

Back to top Go down

Solved Re: Custom Font

Post by Asriel on May 24th 2013, 11:16 pm

OK. It worked. However, let's say I want to change the font, how do I go about doing that? Or size as well. (If that is even possible)

Asriel
Forumember

Male Posts : 583
Reputation : 30
Language : English, Russian, Ukrainian
Location : St. Somewhere

http://www.worldofmutants.forumotion.com

Back to top Go down

Solved Re: Custom Font

Post by E-Mark on May 24th 2013, 11:30 pm

What's the font you want to change with?

E-Mark
Active Poster

Male Posts : 1389
Reputation : 164
Language : English, Tagalog
Location : Republic of the Philippines

http://coding-spot.darkbb.com/

Back to top Go down

Solved Re: Custom Font

Post by Asriel on May 24th 2013, 11:31 pm

Where do I find fonts for that?

Asriel
Forumember

Male Posts : 583
Reputation : 30
Language : English, Russian, Ukrainian
Location : St. Somewhere

http://www.worldofmutants.forumotion.com

Back to top Go down

Solved Re: Custom Font

Post by E-Mark on May 25th 2013, 12:58 am


E-Mark
Active Poster

Male Posts : 1389
Reputation : 164
Language : English, Tagalog
Location : Republic of the Philippines

http://coding-spot.darkbb.com/

Back to top Go down

Solved Re: Custom Font

Post by Asriel on May 25th 2013, 6:43 am

For instance, if I wanted to change the font to "Elemental End". Which parts of the code do I have to alter?

Asriel
Forumember

Male Posts : 583
Reputation : 30
Language : English, Russian, Ukrainian
Location : St. Somewhere

http://www.worldofmutants.forumotion.com

Back to top Go down

Solved Re: Custom Font

Post by E-Mark on May 25th 2013, 6:53 am

Click on the "Details" button > Click the "Cufon Kit Download" tab > Scroll down and find the "JavaScript Code" field/space, then copy the first 2 script, then replace it with the first 2 script on the code i provide you.

Here is an example of the first 2 script:
Code:
<script src="http://cufon.shoqolate.com/js/cufon-yui.js" type="text/javascript"></script>
<script src="elemental-end.cufonfonts.js" type="text/javascript"></script>

Then tadaaa Very Happy.

E-Mark
Active Poster

Male Posts : 1389
Reputation : 164
Language : English, Tagalog
Location : Republic of the Philippines

http://coding-spot.darkbb.com/

Back to top Go down

Solved Re: Custom Font

Post by Asriel on May 25th 2013, 7:02 am

AWESOME!!! OK...OK...I got 2 more questions and I think we can consider this topic solved.

How do I change the size of the code?

AND...

How can I change the text of this?


Asriel
Forumember

Male Posts : 583
Reputation : 30
Language : English, Russian, Ukrainian
Location : St. Somewhere

http://www.worldofmutants.forumotion.com

Back to top Go down

Solved Re: Custom Font

Post by E-Mark on May 25th 2013, 7:33 am

Now let's focus on the last script tag.
This must be the code:
Code:
<script>
Cufon.replace('.elementalend_italic', { fontFamily: 'ElementalEnd Italic', hover: true });
</script>

Now we need to replace the elementalend_italic with an class to change the font, so the class for it is table.forumline th. So the last script must be like this:
Code:
<script>
Cufon.replace('table.forumline th', { fontFamily: 'ElementalEnd Italic', hover: true });
</script>

Very Happy

E-Mark
Active Poster

Male Posts : 1389
Reputation : 164
Language : English, Tagalog
Location : Republic of the Philippines

http://coding-spot.darkbb.com/

Back to top Go down

Solved Re: Custom Font

Post by Asriel on May 25th 2013, 4:53 pm

Sorry you lost me. So,I am putting this code in the same are as the first one. Before </end> tag? Also, am I combining these 2 codes together or what?

Asriel
Forumember

Male Posts : 583
Reputation : 30
Language : English, Russian, Ukrainian
Location : St. Somewhere

http://www.worldofmutants.forumotion.com

Back to top Go down

Solved Re: Custom Font

Post by E-Mark on May 26th 2013, 12:22 am

Yep, they're combine.

Ok, i'll summarize it.
Go to "Details" button > Click the "Cufon Kit Download" tab > Scroll down and find the "JavaScript Code" field/space > Copy all the codes.
- Now focus on the last script first of the cufon. The last script of the cufon is this:
Code:
<script>
Cufon.replace('.elementalend_italic', { fontFamily: 'ElementalEnd Italic', hover: true });
</script>

Now you need to replace the .elementalend_italic to the class where you want to apply the cufon, now since you want to change the title's head font of the category, the class for it is table.forumline th

So you're going to replace the .elementalend_italic with table.forumline th.
The output should be something like this now:
Code:
<script src="http://cufon.shoqolate.com/js/cufon-yui.js" type="text/javascript"></script>
<script src="elemental-end.cufonfonts.js" type="text/javascript"></script>
<script>
Cufon.replace('table.forumline th', { fontFamily: 'ElementalEnd Italic', hover: true });
</script>

Now all is set, the last thing to do is to host the javascript (focus on the 2nd script), click the "Details" button > Click the "Cufon Kit Download" tab > Scroll down and find the "Font Download as cufon" button (it will let you download the js cufon which you need to host/upload it then just replace the "elemental-end.cufonfonts.js" with the link of the javascript i told you to upload/host)

E-Mark
Active Poster

Male Posts : 1389
Reputation : 164
Language : English, Tagalog
Location : Republic of the Philippines

http://coding-spot.darkbb.com/

Back to top Go down

Solved Re: Custom Font

Post by Asriel on May 27th 2013, 12:11 am

OK. GOT IT!!!

Thank you so much Mark. I appreciate your help on this matter.

Asriel
Forumember

Male Posts : 583
Reputation : 30
Language : English, Russian, Ukrainian
Location : St. Somewhere

http://www.worldofmutants.forumotion.com

Back to top Go down

Solved Re: Custom Font

Post by SLGray on May 27th 2013, 2:55 am

Topic Solved & Locked


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


SLGray
Administrator
Administrator

Male Posts : 35661
Reputation : 2375
Language : English
Location : United States

http://fmthemes.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