Support Forum - Tag: font

Support Forum - Tag: font - Recent Posts http://www.kriesi.at/support/tags/font Support Forum - Tag: font - Recent Posts en-US Fri, 24 May 2013 03:14:43 +0000 http://bbpress.org/?v=1.0.2 <![CDATA[Search]]> q http://www.kriesi.at/support/search.php HammerbyGB on "Adding Instagram Icon to Links" http://www.kriesi.at/support/topic/adding-instagram-icon-to-links#post-113384 Thu, 23 May 2013 20:29:25 +0000 HammerbyGB 113384@http://www.kriesi.at/support/ Yeah sorry about it, but this appeared when I was browsing Enfold´s sub forum, I don't know why. Nick on "Adding Instagram Icon to Links" http://www.kriesi.at/support/topic/adding-instagram-icon-to-links#post-113094 Wed, 22 May 2013 22:24:00 +0000 Nick 113094@http://www.kriesi.at/support/ Hi, I think you are confusing Enfold with Replete. Enfold has the glyphs while Replete has the icons. So. To add a new social media icon 1) find your icon (google image search) 2) Look in your theme /images/icon folder to find the current social media icons which are 42x84 pixels and.. well i made a mockup for you, not the best , but i am sure you can find something or spend a couple of minutes making it <a href="http://i.imgur.com/rFS48mp.png" rel="nofollow">http://i.imgur.com/rFS48mp.png</a>, just download this image and use it for now. 2) upload the image/icon in Admin > Media > Add New. Make sure to copy the URL where the image you uploaded is located. 3) open up /includes/admin/register-admin-options.php and find line 110 which looks like <pre><code>'LinkedIn' => 'linkedin',</code></pre> and replace it with these two lines <pre><code>'Instagram' => 'instagram', 'LinkedIn' => 'linkedin',</code></pre> Now add this css to /css/custom.css or to Replete > Theme Options > Styles .. the text area at the bottom of that page. Now from step 1 you should have the URL where you uploaded the image that looks like <a href="http://www.your-domain.com/uploads/2013/4/23/instagram.png" rel="nofollow">http://www.your-domain.com/uploads/2013/4/23/instagram.png</a> (somethinglike this),. paste it into the code below where it says ADD URL HERE <pre><code>.social_bookmarks_instagram a{ background: transparent url(ADD URL HERE) center 0px no-repeat; } .social_bookmarks_instagram:hover a, body .social_bookmarks_instagram .css_3_hover { background-position: center -43px; background-color:#000000; }</code></pre> Its quite easy. Please let us know how it went. Thanks, Nick andypeck on "**SLAB TEXT** Using a class in a text block" http://www.kriesi.at/support/topic/slab-text-using-a-class-in-a-text-block#post-113047 Wed, 22 May 2013 18:37:22 +0000 andypeck 113047@http://www.kriesi.at/support/ It ok... I worked it out. I already knew it but it was playing me up and it was late. Cheers Devin on "**SLAB TEXT** Using a class in a text block" http://www.kriesi.at/support/topic/slab-text-using-a-class-in-a-text-block#post-112961 Wed, 22 May 2013 14:20:18 +0000 Devin 112961@http://www.kriesi.at/support/ Hi Andy, If you are having issues with writing and setting a class you will need to look into a freelance developer to get it set up for you. The basics are pretty straightforward but we aren't really able to do the continued support for customizations like that. Regards, Devin Ismael on "Custom Font" http://www.kriesi.at/support/topic/custom-font#post-112813 Wed, 22 May 2013 03:09:03 +0000 Ismael 112813@http://www.kriesi.at/support/ Hi, You should try this plugin <a href="http://wordpress.org/plugins/wp-font-face/" rel="nofollow">http://wordpress.org/plugins/wp-font-face/</a>. Cheers, Ismael HammerbyGB on "Adding Instagram Icon to Links" http://www.kriesi.at/support/topic/adding-instagram-icon-to-links#post-112749 Tue, 21 May 2013 20:50:32 +0000 HammerbyGB 112749@http://www.kriesi.at/support/ Hello KaraN2my, AFAIK the icons are a custom font hardcoded into the theme. I want to add a custom icon too but I'd like for support to tell us what would be the best practice to do so. andypeck on "**SLAB TEXT** Using a class in a text block" http://www.kriesi.at/support/topic/slab-text-using-a-class-in-a-text-block#post-112684 Tue, 21 May 2013 14:02:24 +0000 andypeck 112684@http://www.kriesi.at/support/ Hi there, So I added Bebas Neue and got that working so I could change h6 to Bebas but as im only using it for 'BIG' slab text in a few pages I didnt want exclusivity to h6 especially as the theme uses. It was suggested I set up a class but thats where Ive come unstuck and where ive struggled to find tutorials I can understand. What are the 'steps' to creating a class and then calling it up in a basic text block within the Avia Layout Builder? Id like to use the words CREATIVE & DIVERSE, where its all 80px size but where 'CREATIVE' and '"DIVERSE are grey but the letter '&' is in orange. However, the text actually has no spaces between the words so it reads... CREATIVE&DIVERSE. The tricky bit is then making sure that when its is reduced on a mobile device (responsive) that it either shrinks properly or wraps on multiple lines (centred). I get confused between spans, classes & divs so if someone can help me get started then id be grateful. P.s. I tried to use WP SLAB TEXT plugin but because it uses the structure of calling up a class and Im not writing it correctly I got stuck on that too. It also uses 'pipes' to split the text so advice all round please Cheers Andy KaraN2my on "Adding Instagram Icon to Links" http://www.kriesi.at/support/topic/adding-instagram-icon-to-links#post-112621 Tue, 21 May 2013 09:42:21 +0000 KaraN2my 112621@http://www.kriesi.at/support/ Hi, I noticed that Instagram is not one of social media accounts that can be featured in the social media mini icon links at the right-hand side of the theme pages. (The ones that stay fixed to the right-hand side of the browser even if you scroll up/down the page). Is it possible to include the Instagram icon to these social media mini icons? How would this be done? Thanks. ocklein on "Custom Font" http://www.kriesi.at/support/topic/custom-font#post-112554 Mon, 20 May 2013 22:57:01 +0000 ocklein 112554@http://www.kriesi.at/support/ I have a custom font I would like to apply to my headers, could you recommend the best way to do that. I have a plugin that puts custom code into page headers and I'm trying to use Typekit, which uses an @fontface. So with a Typekit in place I put my code in the header, and apply it to the H1 and H2 tag in the custom CSS, but no luck. I also tried a plugin called Use Any Font, but it seems to only work for Chrome. Any suggestions? andypeck on "Enfold - Making Slab text headings responsive" http://www.kriesi.at/support/topic/enfold-making-slab-text-headings-responsive#post-112231 Sun, 19 May 2013 17:15:06 +0000 andypeck 112231@http://www.kriesi.at/support/ Brilliant... as always Nick. Big thanks. Ill give it go Nick on "Enfold - Making Slab text headings responsive" http://www.kriesi.at/support/topic/enfold-making-slab-text-headings-responsive#post-112221 Sun, 19 May 2013 14:24:33 +0000 Nick 112221@http://www.kriesi.at/support/ Hi, put them in a div and give each a class leaving h6 <pre><code><h6 class="slab-text">Slab 1</h6></code></pre> then use the last css I posted above, but change all... <pre><code>h6 {</code></pre> ...to <pre><code>h6.slab-text {</code></pre> Thanks, Nick andypeck on "Enfold - Making Slab text headings responsive" http://www.kriesi.at/support/topic/enfold-making-slab-text-headings-responsive#post-112050 Fri, 17 May 2013 20:08:46 +0000 andypeck 112050@http://www.kriesi.at/support/ hi there, thanks for all the suggestions and yes im aware that I might be messing up something else by using h6 for my slab text. Other than not using slab text can you suggest one of the h tags thats not really used or another, safer way to get large slab text into my design. I dont want to ruin the aesthetic of this lovely theme. Im sure theres a better way without me having to carve up such code for what is essentially half a dozen big slabs of text. I had wondered if I just use a graphic but it seems a bit of a cop out I welcome suggestions Andy Devin on "Logo Padding, Mega Menu, & Font?" http://www.kriesi.at/support/topic/logo-padding-mega-menu-font#post-111974 Fri, 17 May 2013 16:51:40 +0000 Devin 111974@http://www.kriesi.at/support/ Hi mdlhale, You should never edit the css files from the theme directly, instead add your css to the Styling tabs Quick CSS field or in the theme files the blank custom.css file which is meant for your own custom css. For the logo, there isn't any padding that I can see that might correct what you are describing. The logo gets floated left with this: <pre><code>div .logo { float: left; position: absolute; left: 0; }</code></pre> So whatever size it is, its just float: left to be on the left size. If you wanted somethign different, an example showing the logo would help :) The font in the demo is: <code>13px/1.65em "HelveticaNeue", "Helvetica Neue",Helvetica,Arial,sans-serif</code> So, 13px HelveticaNeue. For the mega menu, if you can show us an example we'll see why that is happening (it shouldn't be). Regards, Devin Nick on "Enfold - Making Slab text headings responsive" http://www.kriesi.at/support/topic/enfold-making-slab-text-headings-responsive#post-111960 Fri, 17 May 2013 15:59:40 +0000 Nick 111960@http://www.kriesi.at/support/ Hi, Since you are using the font in all screen sizes there is no need to load it in each of the media queries. Only indicate the changes for that specific query without repeating yourself. so you would have <pre><code>/* DECLARE FONTS */ @font-face { font-family:'BebasNeueRegular'; src:url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.eot'); src:url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.woff') format('woff'),url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.ttf') format('truetype'),url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg'); font-weight:normal; font-style:normal; } h6 { font-family:BebasNeueRegular,Geneva,Arial,Helvetica,sans-serif !important; font-size:95pt; margin-bottom:-20px; letter-spacing:-0.0em !important; font-weight: 200 !important; } /* #Media Queries========================================================================================== */ /* Smaller than standard 960 (devices and browsers) */ @media only screen and (max-width:959px) { h6 { font-size:80pt !important; margin-bottom: 20px !important; } } /* Tablet Portrait size to standard 960 (devices and browsers) */ @media only screen and (min-width:768px) and (max-width:959px) { h6 { font-size:70pt !important; margin-bottom: -15px !important; } } /* All Mobile Sizes (devices and browser) */ @media only screen and (max-width:767px) { h6 { font-size:60pt !important; margin-bottom: -20px !important; } } /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */ @media only screen and (min-width:480px) and (max-width:767px) { h6 { font-size:80pt !important; margin-bottom: -20px !important; } } /* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */ @media only screen and (max-width:479px) { h6 { font-size:50pt !important; margin-bottom: -10px !important; } }</code></pre> Be careful when using a very broad selector like h6, it has no specificity and is defined many times in the theme with much higher specificity which will override/counterfeit your code very easily. You also do not need this block ... @media only screen and (max-width:767px) { ...or this block ....@media only screen and (max-width:959px) { .... can you think of one screen size where the blocks of code below it aren't already targeting it? the only reason for 767 that i can think of is for the dropdown menu for all small screens, but 959.... dont know Thanks, Nick Ismael on "Enfold - Making Slab text headings responsive" http://www.kriesi.at/support/topic/enfold-making-slab-text-headings-responsive#post-111772 Fri, 17 May 2013 00:30:26 +0000 Ismael 111772@http://www.kriesi.at/support/ Hi, It depends on what device you are trying to target. You only need this if you're trying to target screens with 959px resolution and lower that includes iPad, iPhone and other mobile devices. <pre><code>/* Smaller than standard 960 (devices and browsers) */ @media only screen and (max-width: 959px) { @font-face { font-family: 'BebasNeueRegular'; src: url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.eot'); src: url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.woff') format('woff'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.ttf') format('truetype'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg'); font-weight: normal; font-style: normal; } h6 { font-family: BebasNeueRegular, Geneva, Arial, Helvetica, sans-serif !important; font-size: 80pt !important; margin-bottom: 20px !important; letter-spacing: -0.0em !important; font-weight:200 !important; } }</code></pre> Regards, Ismael andypeck on "Enfold - Making Slab text headings responsive" http://www.kriesi.at/support/topic/enfold-making-slab-text-headings-responsive#post-111575 Thu, 16 May 2013 05:43:21 +0000 andypeck 111575@http://www.kriesi.at/support/ BIG BIG thanks... Although it seems rather long winded for one heading. Would there be a short-hand version or a better way to write this: SEE BELOW..... /* DECLARE FONTS */ @font-face { font-family: 'BebasNeueRegular'; src: url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.eot'); src: url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.woff') format('woff'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.ttf') format('truetype'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg'); font-weight: normal; font-style: normal; } h6 { font-family: BebasNeueRegular, Geneva, Arial, Helvetica, sans-serif !important; font-size: 95pt !important; margin-bottom: -20px !important; letter-spacing: -0.0em !important; font-weight:200 !important; } /* #Media Queries ========================================================================================== */ /* Smaller than standard 960 (devices and browsers) */ @media only screen and (max-width: 959px) { @font-face { font-family: 'BebasNeueRegular'; src: url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.eot'); src: url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.woff') format('woff'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.ttf') format('truetype'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg'); font-weight: normal; font-style: normal; } h6 { font-family: BebasNeueRegular, Geneva, Arial, Helvetica, sans-serif !important; font-size: 80pt !important; margin-bottom: 20px !important; letter-spacing: -0.0em !important; font-weight:200 !important; } } /* Tablet Portrait size to standard 960 (devices and browsers) */ @media only screen and (min-width: 768px) and (max-width: 959px) { @font-face { font-family: 'BebasNeueRegular'; src: url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.eot'); src: url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.woff') format('woff'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.ttf') format('truetype'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg'); font-weight: normal; font-style: normal; } h6 { font-family: BebasNeueRegular, Geneva, Arial, Helvetica, sans-serif !important; font-size: 70pt !important; margin-bottom: -15px !important; letter-spacing: -0.0em !important; font-weight:200 !important; } } /* All Mobile Sizes (devices and browser) */ @media only screen and (max-width: 767px) { @font-face { font-family: 'BebasNeueRegular'; src: url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.eot'); src: url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.woff') format('woff'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.ttf') format('truetype'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg'); font-weight: normal; font-style: normal; } h6 { font-family: BebasNeueRegular, Geneva, Arial, Helvetica, sans-serif !important; font-size: 60pt !important; margin-bottom: -20px !important; letter-spacing: -0.0em !important; font-weight:200 !important; } } /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */ @media only screen and (min-width: 480px) and (max-width: 767px) { @font-face { font-family: 'BebasNeueRegular'; src: url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.eot'); src: url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.woff') format('woff'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.ttf') format('truetype'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg'); font-weight: normal; font-style: normal; } h6 { font-family: BebasNeueRegular, Geneva, Arial, Helvetica, sans-serif !important; font-size: 80pt !important; margin-bottom: -20px !important; letter-spacing: -0.0em !important; font-weight:200 !important; } } /* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */ @media only screen and (max-width: 479px) { @font-face { font-family: 'BebasNeueRegular'; src: url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.eot'); src: url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.woff') format('woff'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.ttf') format('truetype'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg'); font-weight: normal; font-style: normal; } h6 { font-family: BebasNeueRegular, Geneva, Arial, Helvetica, sans-serif !important; font-size: 50pt !important; margin-bottom: -10px !important; letter-spacing: -0.0em !important; font-weight:200 !important; } } mdlhale on "Logo Padding, Mega Menu, & Font?" http://www.kriesi.at/support/topic/logo-padding-mega-menu-font#post-111530 Thu, 16 May 2013 01:08:23 +0000 mdlhale 111530@http://www.kriesi.at/support/ I'm sure this is somewhere on the forum, but I wasn't having any luck. First off I want to say, I LOVE this theme, and i'm probably going to buy the extended license if I can get a few items fixed. If my logo is wider than normal or larger, how can I edit the padding? So I don't have a lot of white space between the logo and menu. Where in the CSS file (if thats where it is)? And could I get an example of how to change it? Also, I notice the font is different than the demo, which font was being used on the demo? such as the main content, and menu, etc. I really liked the feel and look of the demo rather than the dummy content. Lastly, sometimes on my megamenu it will popup in a different location than under the menu item. Is this a glitch or should I keep messing with the menu till it works? Thank you so much for a great theme! Ismael on "Menu Style is Different from In Demo?" http://www.kriesi.at/support/topic/menu-style-is-different-from-in-demo#post-111527 Thu, 16 May 2013 00:54:47 +0000 Ismael 111527@http://www.kriesi.at/support/ Hey, Glad that is fixed. :) Regards, Ismael Ismael on "Enfold - Making Slab text headings responsive" http://www.kriesi.at/support/topic/enfold-making-slab-text-headings-responsive#post-111523 Thu, 16 May 2013 00:45:46 +0000 Ismael 111523@http://www.kriesi.at/support/ Hi, For example, you want to apply the style when viewing on a mobile device, you should use this <pre><code>/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */ @media only screen and (max-width: 479px) { @font-face { font-family: 'BebasNeueRegular'; src: url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.eot'); src: url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.woff') format('woff'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.ttf') format('truetype'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg'); font-weight: normal; font-style: normal; } h6 { font-family: BebasNeueRegular, Geneva, Arial, Helvetica, sans-serif !important; font-size: 90pt !important; letter-spacing: -0.0em !important; font-weight:200 !important; } }</code></pre> The font will only apply if the user is viewing on a mobile device. Regards, Ismael swazzi on "Menu Style is Different from In Demo?" http://www.kriesi.at/support/topic/menu-style-is-different-from-in-demo#post-111422 Wed, 15 May 2013 16:31:27 +0000 swazzi 111422@http://www.kriesi.at/support/ Worked perfectly. Never woulda figured that one out alone. Thank you Ismael! andypeck on "Enfold - Making Slab text headings responsive" http://www.kriesi.at/support/topic/enfold-making-slab-text-headings-responsive#post-111417 Wed, 15 May 2013 16:24:50 +0000 andypeck 111417@http://www.kriesi.at/support/ Hi Devin, Thanks for your help although I think there's a bit in the middle im missing.... Ive installed Bebas Neue and have it working as an h6 heading on a standard page layout. However, as discussed when I shrink the page the h6 header remains the same. I merely added your text to the CSS but cant see how to link the h6 to your code thus nothing has happened. What do I need to do to link your code and would I need to do it for every h tag (h2,h3 etc) if I wanted to change other headings too My CSS is setup as follows: @font-face { font-family: 'BebasNeueRegular'; src: url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.eot'); src: url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.woff') format('woff'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.ttf') format('truetype'), url('http://localhost:8888/wordpress/wp-content/themes/enfold-child/fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg'); font-weight: normal; font-style: normal; } h6 { font-family: BebasNeueRegular, Geneva, Arial, Helvetica, sans-serif !important; font-size: 90pt !important; letter-spacing: -0.0em !important; font-weight:200 !important; } Devin on "Enfold - Making Slab text headings responsive" http://www.kriesi.at/support/topic/enfold-making-slab-text-headings-responsive#post-111406 Wed, 15 May 2013 15:54:18 +0000 Devin 111406@http://www.kriesi.at/support/ Hi andypeck, You would need to add a media query to your custom.css file (in the theme's css folder) to then target the h6 and change the font-size declaration. You can add this to your custom.css file and use it as a starting point to add in your css for each screen size you want to change the css on: <pre><code>/* #Media Queries ================================================== */ /* Smaller than standard 960 (devices and browsers) */ @media only screen and (max-width: 959px) {} /* Tablet Portrait size to standard 960 (devices and browsers) */ @media only screen and (min-width: 768px) and (max-width: 959px) {} /* All Mobile Sizes (devices and browser) */ @media only screen and (max-width: 767px) {} /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */ @media only screen and (min-width: 480px) and (max-width: 767px) {} /* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */ @media only screen and (max-width: 479px) {}</code></pre> Regards, Devin andypeck on "Enfold - Making Slab text headings responsive" http://www.kriesi.at/support/topic/enfold-making-slab-text-headings-responsive#post-111304 Wed, 15 May 2013 05:51:43 +0000 andypeck 111304@http://www.kriesi.at/support/ Hi there, Ive added/installed Bebas from fontsquirrel to use to change my headings in some places. In particular ive tweaked h6 (in my enfold css file) to use for a huge slab text heading (something like 70px). The text itself ive added as normal through the text layout tool however, its not being responsive when I scale down the page. What do I need to do? Cheers Devin on "Different font for menu for more space" http://www.kriesi.at/support/topic/different-font-for-menu-for-more-space#post-111150 Tue, 14 May 2013 16:21:33 +0000 Devin 111150@http://www.kriesi.at/support/ Hi mmoesslang, A) Try adding the following CSS to your Quick CSS (located under the Styling Tab in the theme options) or the custom.css file in the css folder of your theme files: <pre><code>#top .main_menu .menu li a { font-family: Arial; }</code></pre> Read more about font-family <a href="http://www.w3schools.com/cssref/pr_font_font-family.asp" rel="nofollow">http://www.w3schools.com/cssref/pr_font_font-family.asp</a> B) I don't know of a way to easily move the search icon/functionality from the main menu as its kind of a theme function. I've asked Kriesi about it just now and will update when I know more. C) We'll need to see the issue live to inspect the code and see whats going on. So if you can provide a link, we'll look further. Regards, Devin andypeck on "Installing Bebas Neue for Slab & Slider" http://www.kriesi.at/support/topic/installing-bebas-neue-for-slab-slider#post-111097 Tue, 14 May 2013 11:57:20 +0000 andypeck 111097@http://www.kriesi.at/support/ Great stuff Thank you Dude on "Installing Bebas Neue for Slab & Slider" http://www.kriesi.at/support/topic/installing-bebas-neue-for-slab-slider#post-111040 Tue, 14 May 2013 06:06:20 +0000 Dude 111040@http://www.kriesi.at/support/ You can generate a font kit. Go to: <a href="http://www.fontsquirrel.com/fonts/bebas-neue" rel="nofollow">http://www.fontsquirrel.com/fonts/bebas-neue</a> and click on "Webfont kit" to download the webfonts. Then place these fonts into the enfold/css folder and insert the content of stylesheet.css into custom.css. Then use <pre><code>font-family: 'BebasNeueRegular';</code></pre> to apply the font to any html element of your choice. If you use Layerlider you just need to insert BebasNeueRegular into the font family option field. <img src="http://www.clipular.com/c?5598023=oZeWMrZWaKWc7VHDhnzpCofAcDc&f=.png" /> andypeck on "Installing Bebas Neue for Slab & Slider" http://www.kriesi.at/support/topic/installing-bebas-neue-for-slab-slider#post-111022 Tue, 14 May 2013 05:21:57 +0000 andypeck 111022@http://www.kriesi.at/support/ Hi there, Im testing out with Full Width Easy Slider but as I want to add my own colors for the text box and the fonts im figuring the best one will be the Advanced Layer Slider. I have Revolution too which I know from experience can be tricky to use anything other than google fonts. I would like to use Bebas Neue for not only for my Slider but also in a SLAB TEXT HEADER Cheers Ismael on "Installing Bebas Neue for Slab & Slider" http://www.kriesi.at/support/topic/installing-bebas-neue-for-slab-slider#post-110975 Tue, 14 May 2013 00:49:25 +0000 Ismael 110975@http://www.kriesi.at/support/ Hi, What slider are you using? Regards, Ismael andypeck on "Installing Bebas Neue for Slab & Slider" http://www.kriesi.at/support/topic/installing-bebas-neue-for-slab-slider#post-110951 Mon, 13 May 2013 23:14:34 +0000 andypeck 110951@http://www.kriesi.at/support/ Hi there is there a way to install Bebas Neue so it can be used in the sliders as well as within the main content as a huge slab header Cheers mmoesslang on "Different font for menu for more space" http://www.kriesi.at/support/topic/different-font-for-menu-for-more-space#post-110914 Mon, 13 May 2013 18:41:57 +0000 mmoesslang 110914@http://www.kriesi.at/support/ My menu overlaps the logo but I need all the menu items. A How can I set a different font (at the moment it is Signika Negative in bold) for the menues only? B How can I get the magnifier from header menu to top menu? Or in the sidebar? C My top menu has only two entries plus the telephone number, but the number is shown beyond those two instead of nearby. What can I do? Thanks!