http://www.kriesi.at/support/tags/font-face Support Forum - Tag: @font-face - Recent Posts en-US Wed, 22 May 2013 13:01:26 +0000 http://bbpress.org/?v=1.0.2 q http://www.kriesi.at/support/search.php http://www.kriesi.at/support/topic/face-font-blurry-or-is-it-just-me#post-86419 Tue, 04 Dec 2012 04:03:00 +0000 Ismael 86419@http://www.kriesi.at/support/ <p>Hi,</p> <p>They look ok to me, just a bit small. Try to add this on your custom.css</p> <pre><code>.product h3, .product h4, .product h5, .product h6 { font-size: 17px; }</code></pre> <p>Regards,<br /> Ismael </p> http://www.kriesi.at/support/topic/face-font-blurry-or-is-it-just-me#post-86336 Mon, 03 Dec 2012 18:16:43 +0000 ChaosWeb 86336@http://www.kriesi.at/support/ <p>by the way you can check out my page here <a href="http://webtechnology.ph" rel="nofollow">http://webtechnology.ph</a> the titles of the products below looks blurry. im not sure if its my eye or something. </p> http://www.kriesi.at/support/topic/face-font-blurry-or-is-it-just-me#post-86335 Mon, 03 Dec 2012 18:15:45 +0000 ChaosWeb 86335@http://www.kriesi.at/support/ <p>please help me out the titles on my products looks blurry. and i cant change the size of it please help </p> http://www.kriesi.at/support/topic/menusubmenu-font-face-and-youtube-issue#post-83170 Sat, 10 Nov 2012 03:06:51 +0000 cindsoo 83170@http://www.kriesi.at/support/ <p>Thanks Devin. I will try. </p> http://www.kriesi.at/support/topic/menusubmenu-font-face-and-youtube-issue#post-82880 Thu, 08 Nov 2012 14:45:16 +0000 Devin 82880@http://www.kriesi.at/support/ <p>Hi Chi,</p> <p>It looks like maybe a line height difference between where you've customized the menu and something left over from hovering on the menu items. I went through all the basics of what I would guess it to be but didn't have any success.</p> <p>You may need to go through your custom.css and comment out each change until it fixes itself you can identify what the cause is.</p> <p>Regards,</p> <p>Devin </p> http://www.kriesi.at/support/topic/menusubmenu-font-face-and-youtube-issue#post-82812 Thu, 08 Nov 2012 04:07:21 +0000 cindsoo 82812@http://www.kriesi.at/support/ <p>I was able to get everything done except for the above issue. On a sub page, the menu shift 1px to the left when you mouseover the SHOP nav.</p> <p>This css is shared with the other so each time I made changes to it, it got applied to all. Can someone provide me with the correct css? </p> <p>Thank you kindly.</p> <p>Chi. </p> http://www.kriesi.at/support/topic/menusubmenu-font-face-and-youtube-issue#post-82779 Wed, 07 Nov 2012 21:52:09 +0000 cindsoo 82779@http://www.kriesi.at/support/ <p>I have another issue, on the sub page such as this <a href="http://wordpresscreatives.com/sites/ncc-shop/shop/scarf" rel="nofollow">http://wordpresscreatives.com/sites/ncc-shop/shop/scarf</a>, the SHOP nav on mouseover move 1px to the left, how can I prevent this from happening?</p> <p>Thanks. </p> http://www.kriesi.at/support/topic/menusubmenu-font-face-and-youtube-issue#post-82771 Wed, 07 Nov 2012 20:29:08 +0000 cindsoo 82771@http://www.kriesi.at/support/ <p>Hi Devin,</p> <p>Everything in the nav seems to be ok except for changing the width of the sub menu.</p> <pre><code>&lt;!-- sub menu width --&gt; #top .main_menu .avia_mega ul &gt; li &gt; ul a { width: 150px; }</code></pre> http://www.kriesi.at/support/topic/menusubmenu-font-face-and-youtube-issue#post-82767 Wed, 07 Nov 2012 20:12:05 +0000 cindsoo 82767@http://www.kriesi.at/support/ <p>Issue 3 was also solved by using class="noLightbox" as suggested.</p> <p>Thanks.</p> <p>Now I only have issue one to deal with. =) </p> http://www.kriesi.at/support/topic/menusubmenu-font-face-and-youtube-issue#post-82766 Wed, 07 Nov 2012 20:09:50 +0000 cindsoo 82766@http://www.kriesi.at/support/ <p>Wow Devin,</p> <p>Thanks alot for the quick feedback!!</p> <p>I will try your suggestions and see if they will work.</p> <p>In the meantime, in regard to the Safari browser, I was able to fix the 1px by using a Safari hack.</p> <p>So issue 4 was also fixed. </p> http://www.kriesi.at/support/topic/menusubmenu-font-face-and-youtube-issue#post-82754 Wed, 07 Nov 2012 19:42:45 +0000 Devin 82754@http://www.kriesi.at/support/ <p>Hi Chi,</p> <p>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:<br /> <pre><code>&lt;!--left menu border--&gt; #top .main_menu .avia_mega &gt; li:hover, #top .main_menu .avia_mega &gt; .current-menu-item { border-left: none; } &lt;!-- sub menu hover color--&gt; #top .main_menu .avia_mega ul ul li:hover, #top .main_menu .avia_mega &gt; li &gt; ul li:hover { background-color: #333; } &lt;!-- sub menu width --&gt; #top .main_menu .avia_mega &gt; li &gt; ul a { width: 170px; }</code></pre> <p>c) Go to Appearance&gt;Menus in the Wordpress admin and expand one of your menu items. There should be a checkbox to make the link open in a new window. If not, go to the top right hand of the screen and Show Options. Check the box for Link Target then it should show up on the menu items.</p> <p>d) I'm not getting the same behavior so I'm not sure how to change it. It would be the first time I've heard of the issue with Abundance however so it could be a browser issue or something local.</p> <p>e) No there is not. Its just a really big un-ordered list though so pretty standard.</p> <p>For the font, if you don't have the font loaded in by google fonts, cufon or something like that there isn't any way for the users computer to render it. IE, if needs to be a standard web safe font or else you have to add load it into the users computer for them to render.</p> <p>Set your links to have the class noLightbox like the following example to remove the lightbox functionality from them:<br /> <code>&lt;a class=&quot;noLightbox&quot; href=&quot;http://www.youtube.com/&quot;&gt;Youtube&lt;/a&gt;</code></p> <p>The 1 pixel difference is probably something that Safari does slightly differenly than other browsers but I'm not able to test for at the moment. Your best bet is to inspect the code and see if you can find what change will make it fit perfectly and see if changing the css effects other browsers.</p> <p>Regards,</p> <p>Devin </p> http://www.kriesi.at/support/topic/menusubmenu-font-face-and-youtube-issue#post-82753 Wed, 07 Nov 2012 19:33:56 +0000 cindsoo 82753@http://www.kriesi.at/support/ <p>Ok I was able to resolved issue 2: font face. </p> http://www.kriesi.at/support/topic/menusubmenu-font-face-and-youtube-issue#post-82718 Wed, 07 Nov 2012 17:10:24 +0000 cindsoo 82718@http://www.kriesi.at/support/ <p>I have a few issues with the Abundance theme and I was wondering if someone here can kindly give me a hand. You can preview my site here: <a href="http://wordpresscreatives.com/sites/ncc-shop/" rel="nofollow">http://wordpresscreatives.com/sites/ncc-shop/</a></p> <p>Issue 1: Navigation</p> <p>a) On hover of main menu, I do not know how to remove the left hand border which shows up next to the main menu item.</p> <p>b) Submenu: On mouseover, the text turns red and the background changes to a different color, I do not know how to add a different background color. I tried and it only applied to the submenu item but not to the whole horizontal area the item is in.</p> <p>Also how do I resize the width of the submenu?</p> <p>c) How to open the menu using “target=new”? There are a few menu items I wish to open up into a different browser window but I am unsure how to do this.</p> <p>d) When you mouseover the main menu items quickly and try to access its sub menu items, sometimes the sub menu items disappear and you need to mouseover the parent menu again in order to access them. Is there a way to prevent this?</p> <p>e) Is there a link somewhere which gives the breakdown structure of the nav? I have edited the menu and submenu css in the custom.css and it looks messy. </p> <p>Issue 2: font-face<br /> I have set a “font-face” “Daxlight” in the custom css and when I reference it, the font isn’t being applied. It seems to get applied in the Safari browser but NOT Mozilla or IE. </p> <p>I need to apply this font-face to: menu items, headings and footer.</p> <p>What am I doing wrong? I have set the “Heading Font” OFF in the Abundance Theme Options.</p> <p>Issue 3: YouTube videos<br /> I like how the YouTube video plays in a JQuery layer but there is one location I wish to turn this functionality off. Is there a way to do this?</p> <p>In the header, you see 3 social icons “Facebook, YouTube and Twitter”. However since the YouTube is a link to a channel and NOT a video page, the JQuery layer has issue loading it. How do I fix it? I was thinking of just bringing the user to the YouTube channel page instead of displaying it in the JQuery layer unless there is an easier way of fixing this issue.</p> <p>Issue 4:<br /> In Safari browser, for some strange reason the menu and body of the site is missing 1 pixel to the right. You can see the banner ad is showing.</p> <p>While IE and Firefox doesn’t have this issue. Any idea to fix this?</p> <p>I would like to thank you in advance for the help. Great ecommerce theme by the way!</p> <p>Cheers,</p> <p>Chi. </p> http://www.kriesi.at/support/topic/disable-google-fonts-and-use-own-fonts#post-80305 Fri, 19 Oct 2012 06:00:45 +0000 Dude 80305@http://www.kriesi.at/support/ <p>Hi,<br /> Go to the Theme Options Panel &gt; Styling and scroll to the "Heading Font" option. Select "No Custom Font" to deactivate the standard google font. Afterwards you can use angular/css/custom.css to insert your custom font face css code. Eg fontsquirrel: <a href="http://www.fontsquirrel.com/" rel="nofollow">http://www.fontsquirrel.com/</a> provides a font-face generator. </p> http://www.kriesi.at/support/topic/disable-google-fonts-and-use-own-fonts#post-80231 Thu, 18 Oct 2012 11:35:12 +0000 matsaukeo 80231@http://www.kriesi.at/support/ <p>Hi </p> <p>I'd like to disable the google fonts and use my own fonts (hosted by me) instead. I usually do this using @font-face.</p> <p>What would be the best way of doing this? Would I comment out the link to the google fonts file that is found in the header.php file and then update my custom CSS file? If I were to do that, should I be updating the header.php file or should I be using a child theme? </p> <p>Thanks </p> http://www.kriesi.at/support/topic/add-font-for-headings#post-71105 Wed, 15 Aug 2012 04:31:13 +0000 Mya 71105@http://www.kriesi.at/support/ <p>Great! Let us know if you have any more questions.</p> <p>Regards,<br /> Mya </p> http://www.kriesi.at/support/topic/add-font-for-headings#post-71101 Wed, 15 Aug 2012 03:44:05 +0000 jftell 71101@http://www.kriesi.at/support/ <p>Merci! It works </p> http://www.kriesi.at/support/topic/add-font-for-headings#post-71090 Wed, 15 Aug 2012 02:34:17 +0000 Mya 71090@http://www.kriesi.at/support/ <p>Hi jftell,</p> <p>First, you don't want to make any CSS modifications to layout.css. Instead, you should use custom.css or Quick CSS found in Theme Options &gt; Styling. Reason I mention this is because any modifications you make to layout.css may be lost if/when you download any new versions of the theme.</p> <p>To answer your question, I believe all you need to do is add this to your custom.css.</p> <pre><code>h1, h2, h3, h4, h5, h6, tr.pricing-row td, #top .portfolio-title, .callout .content-area, .avia-big-box .avia-innerbox { font-family: Open Sans; }</code></pre> <p>You'll want to replace Open Sans with your HelveticaNeueMedium or Helvetica Neue Medium.</p> <p>Regards,<br /> Mya </p> http://www.kriesi.at/support/topic/add-font-for-headings#post-71081 Wed, 15 Aug 2012 01:14:43 +0000 jftell 71081@http://www.kriesi.at/support/ <p>Hello, Choices is a great theme. I need to be able to use Helvetica Neu Medium to replace headings. I khow that Headings Fonts in Styling Options use Google Api. I first thought that I could use cufon in heading by adding the fontname.js that I generated but it seems only be usefull for body text. So?</p> <p>You've added css line at the bottom of layout.css. I created all the useful fonts formats, created the fonts folder at root and linked those files in layout.css</p> <p>Is it the way to be able to use my new font for headings?<br /> Do you khow a better way and the next step to solve my problem? </p> http://www.kriesi.at/support/topic/font-face-with-angular-theme#post-59969 Wed, 13 Jun 2012 05:58:29 +0000 Ismael 59969@http://www.kriesi.at/support/ <p>Hey,</p> <p>Glad it is fixed.</p> <p>Regards,<br /> Ismael </p> http://www.kriesi.at/support/topic/font-face-with-angular-theme#post-59955 Wed, 13 Jun 2012 04:07:07 +0000 smonfils 59955@http://www.kriesi.at/support/ <p>Hey Dude,</p> <p>This turned out to be a simple permissions issue with my hosting. I had it fixed, retested, and the custom fonts work great!</p> <p>Thanks for the insight. </p> http://www.kriesi.at/support/topic/font-face-with-angular-theme#post-58654 Mon, 04 Jun 2012 06:33:39 +0000 Dude 58654@http://www.kriesi.at/support/ <p>I tried to access eg <a href="http://stevemonfils.com/wp-content/themes/angular/fonts/zag/zag_bold-webfont.eot" rel="nofollow">http://stevemonfils.com/wp-content/themes/angular/fonts/zag/zag_bold-webfont.eot</a> directly but it gives me a 404 error. I'd check if the path is correct, if the file exists and the ftp permission rules for the fonts directory. </p> http://www.kriesi.at/support/topic/font-face-with-angular-theme#post-58201 Thu, 31 May 2012 02:29:04 +0000 smonfils 58201@http://www.kriesi.at/support/ <p>Hey Dude,</p> <p>Sorry for the delay. I had to get my site live over the last couple days (I was using a maintenance mode plugin while working on it).</p> <p>I decided to activate a custom font through the theme for the time-being, and turned of my @font-face code, but the font files are located in a folder named "fonts", one directory outside of the custom.css file. I should add that I had no custom fonts selected when I originally tried to get this to work. I hope this helps.</p> <p>The link to my site is:<br /> <a href="http://stevemonfils.com/" rel="nofollow">http://stevemonfils.com/</a></p> <p>Thanks </p> http://www.kriesi.at/support/topic/font-face-with-angular-theme#post-57697 Sun, 27 May 2012 08:21:02 +0000 Dude 57697@http://www.kriesi.at/support/ <p>Can you post a link to your website please? Maybe the fonts don't load properly because the url/path is wrong. Personally I always add the font folder to the css folder (angular/css) and then you just need to use " src: url('fonts/zag/zag_bold-webfont.eot'); " in css/custom.css. </p> http://www.kriesi.at/support/topic/font-face-with-angular-theme#post-57309 Thu, 24 May 2012 03:38:55 +0000 smonfils 57309@http://www.kriesi.at/support/ <p>Hello,</p> <p>I'm making modifications to the Angular theme I recently purchased, and I've hit a roadblock when trying to use @font-face.</p> <p>I have 3 main fonts I want to use for different elements throughout the site. Currently, I have the font kits in a folder I added to the Angular theme content (I originally had them on my root and tried globally linking them. This was unsuccessful as well).</p> <p>Here's my markup for one of the fonts (would post all 3, but I'm using the same syntax for all of them):</p> <p>@font-face {<br /> font-family: 'ZagBoldRegular';<br /> src: url('../fonts/zag/zag_bold-webfont.eot');<br /> src: url('../fonts/zag/zag_bold-webfont.eot?#iefix') format('embedded-opentype'),<br /> url('../fonts/zag/zag_bold-webfont.woff') format('woff'),<br /> url('../fonts/zag/zag_bold-webfont.ttf') format('truetype'),<br /> url('../fonts/zag/zag_bold-webfont.svg#ZagBoldRegular') format('svg');<br /> font-weight: normal;<br /> font-style: normal;<br /> }</p> <p>Then I try to apply it to all h1 tags:</p> <p>h1 {<br /> font-family: ZagBoldRegular; /* tried this with and without quotes) */<br /> font-weight: normal;<br /> }</p> <p>But unfortunately, this has no effect. I read a couple other threads where this was happening, but they were for different themes. I tried a couple solutions and had no luck.</p> <p>Do you have any idea how I might be able to fix this? Thanks in advance for your help. </p>