http://www.kriesi.at/support/tags/custom-css Support Forum - Tag: custom css - Recent Posts en-US Wed, 22 May 2013 02:40:58 +0000 http://bbpress.org/?v=1.0.2 q http://www.kriesi.at/support/search.php http://www.kriesi.at/support/topic/info-text-ribbon-at-top-of-page-working-with-customcss#post-110777 Mon, 13 May 2013 05:27:36 +0000 Dude 110777@http://www.kriesi.at/support/ <p>Because of the child theme name the cookie will not work. please rename the theme to "AngularChild" and remove the whitespace. Then open up wp-content/themes/angular/js/avia.js and replace:<br /> <pre><code>jQuery(document).ready(function(){</code></pre> <p>with:<br /> <pre><code>jQuery(document).ready(function(){ if(jQuery.cookie(&quot;AngularChild_avia_banner&quot;)){ jQuery(&#39;#info_text_header&#39;).addClass(&#39;minimized&#39;); }</code></pre> http://www.kriesi.at/support/topic/info-text-ribbon-at-top-of-page-working-with-customcss#post-110747 Mon, 13 May 2013 02:04:31 +0000 PhaseCreative 110747@http://www.kriesi.at/support/ <p>Thankyou,<br /> I have actioned this code, but now, when the page opens, the blue ribbon is open by default and if you close it, it will be open again when you change the page.</p> <p>I'm so sorry to be a pest. I simply want this to work the way the demo does.</p> <p>that is, opens when you first view the site, and when you close it, it remains closed for the remainder of the viewing session. </p> http://www.kriesi.at/support/topic/info-text-ribbon-at-top-of-page-working-with-customcss#post-110718 Sun, 12 May 2013 23:52:53 +0000 Ismael 110718@http://www.kriesi.at/support/ <p>Hi,</p> <p>Latest version of Angular is 1.6.5. </p> <p>To fix the ribbon, open functions.php then find this code</p> <pre><code>###################################################################### # /*creates the notification banner at the top of your website*/ ###################################################################### if(!function_exists(&#39;avia_banner&#39;)) { function avia_banner($padding = 0) { $extraClass = &quot;minimized&quot;; $output = &quot;&quot;; $cookieHash = &quot;&quot;; $bannerText = avia_get_option(&#39;banner&#39;); $cookieName = THEMENAME.&#39;_avia_banner&#39;; $bannerHash = md5($bannerText); $padding = $padding * 43; if(!trim($bannerText)) return; if( empty($_COOKIE[$cookieName])) $extraClass = &quot;minimized firstcall&quot;; if(!empty($_COOKIE[$cookieName])) $cookieHash = $_COOKIE[$cookieName]; if(!empty($_COOKIE[$cookieName]) &amp;&amp; $bannerHash != $cookieHash) $extraClass = &quot;maximized&quot;; $output .= &quot;&lt;div class=&#39;$extraClass info_text_header&#39; id=&#39;info_text_header&#39; data-hash=&#39;$bannerHash&#39; data-cookiename=&#39;$cookieName&#39;&gt;&lt;div style=&#39;padding-right:&quot;.$padding.&quot;px;&#39; class=&#39;infotext_wrap&#39;&gt;&quot;; $output .= &quot;&lt;div class=&#39;infotext&#39;&gt;$bannerText &lt;a class=&#39;close_info_text rounded&#39; href=&#39;#close&#39;&gt;&quot;.__(&#39;close&#39;,&#39;avia_framework&#39;).&quot;&lt;/a&gt;&lt;/div&gt;&quot;; $output .= &quot;&lt;/div&gt;&lt;/div&gt;&quot;; echo $output; } }</code></pre> <p>Replace it with this</p> <pre><code>###################################################################### # /*creates the notification banner at the top of your website*/ ###################################################################### if(!function_exists(&#39;avia_banner&#39;)) { function avia_banner($padding = 0) { $extraClass = &quot;minimized&quot;; $output = &quot;&quot;; $cookieHash = &quot;&quot;; $bannerText = avia_get_option(&#39;banner&#39;); $cookieName = THEMENAME.&#39;_avia_banner&#39;; $bannerHash = md5($bannerText); $padding = $padding * 43; if(!trim($bannerText)) return; if( empty($_COOKIE[$cookieName])) $extraClass = &quot;maximized firstcall&quot;; if(!empty($_COOKIE[$cookieName])) $cookieHash = $_COOKIE[$cookieName]; if(!empty($_COOKIE[$cookieName]) &amp;&amp; $bannerHash != $cookieHash) $extraClass = &quot;minimized&quot;; $output .= &quot;&lt;div class=&#39;$extraClass info_text_header&#39; id=&#39;info_text_header&#39; data-hash=&#39;$bannerHash&#39; data-cookiename=&#39;$cookieName&#39;&gt;&lt;div style=&#39;padding-right:&quot;.$padding.&quot;px;&#39; class=&#39;infotext_wrap&#39;&gt;&quot;; $output .= &quot;&lt;div class=&#39;infotext&#39;&gt;$bannerText &lt;a class=&#39;close_info_text rounded&#39; href=&#39;#close&#39;&gt;&quot;.__(&#39;close&#39;,&#39;avia_framework&#39;).&quot;&lt;/a&gt;&lt;/div&gt;&quot;; $output .= &quot;&lt;/div&gt;&lt;/div&gt;&quot;; echo $output; } }</code></pre> <p>Regards,<br /> Ismael </p> http://www.kriesi.at/support/topic/info-text-ribbon-at-top-of-page-working-with-customcss#post-110709 Sun, 12 May 2013 22:14:54 +0000 PhaseCreative 110709@http://www.kriesi.at/support/ <p>Thanks Devin, the funky characters weren't showing in dreamweaver but when I looked at it in text editor, Bingo. So that fixed the whole style.css issue. Brilliant.</p> <p>Back to the ribbon. I reinstalled the theme files in April. How many new releases have there been? Which files in particular should I update? This site is live now and client is finicky about down time so I need to be carefull. Any hints? I'm getting to the display: none point! </p> http://www.kriesi.at/support/topic/info-text-ribbon-at-top-of-page-working-with-customcss#post-108498 Thu, 02 May 2013 17:50:30 +0000 Devin 108498@http://www.kriesi.at/support/ <p>Hi PhaseCreative,</p> <p>I'm not sure if this is related but your child theme style.css file has some stray data in the import url line: <a href="http://fishtankcreative.com.au/wp/wp-content/themes/angular-child/style.css" rel="nofollow">http://fishtankcreative.com.au/wp/wp-content/themes/angular-child/style.css</a></p> <p>For the info pane, try updating the main theme files as there have been some bug fixes and updates in 1.6.5 that may help.</p> <p>Regards,</p> <p>Devin </p> http://www.kriesi.at/support/topic/info-text-ribbon-at-top-of-page-working-with-customcss#post-108307 Thu, 02 May 2013 01:07:11 +0000 PhaseCreative 108307@http://www.kriesi.at/support/ <p>fishtankcreative.com.au is the URL. </p> <p>Thanks in advance </p> http://www.kriesi.at/support/topic/info-text-ribbon-at-top-of-page-working-with-customcss#post-108078 Wed, 01 May 2013 04:08:35 +0000 PhaseCreative 108078@http://www.kriesi.at/support/ <p>Thanks Peter,<br /> Client has it in maintenance mode for now, I'll post the URL when it goes live in the next day or 2.<br /> Your help is appreciated. </p> http://www.kriesi.at/support/topic/info-text-ribbon-at-top-of-page-working-with-customcss#post-107914 Tue, 30 Apr 2013 04:58:28 +0000 Dude 107914@http://www.kriesi.at/support/ <p>Hey! </p> <p> Can you post a link to your website please? The code works on my test server but maybe you renamed the theme or there's another reason why it does not work. </p> <p> Best regards,<br /> Peter </p> http://www.kriesi.at/support/topic/info-text-ribbon-at-top-of-page-working-with-customcss#post-107714 Mon, 29 Apr 2013 00:11:29 +0000 PhaseCreative 107714@http://www.kriesi.at/support/ <p>Thanks for your reply. Unfortunately, updating the JS didn't work (I made the change, reuploaded the avia.js file and emptied the cache and deleted cookies on chrome, safari, firefox).</p> <p>Any other suggestions? </p> http://www.kriesi.at/support/topic/info-text-ribbon-at-top-of-page-working-with-customcss#post-105869 Wed, 17 Apr 2013 11:17:07 +0000 Dude 105869@http://www.kriesi.at/support/ <p>Hi,<br /> 1) You don't need custom.css in your child theme because the child theme style.css will be used for your custom styles instead.</p> <p>2) To fix the banner issue - please open up wp-content/themes/angular/js/avia.js and replace:</p> <pre><code>jQuery(document).ready(function(){</code></pre> <p>with:</p> <pre><code>jQuery(document).ready(function(){ if(jQuery.cookie(&quot;Angular_avia_banner&quot;)){ jQuery(&#39;#info_text_header&#39;).addClass(&#39;minimized&#39;); }</code></pre> http://www.kriesi.at/support/topic/info-text-ribbon-at-top-of-page-working-with-customcss#post-105698 Tue, 16 Apr 2013 01:52:12 +0000 PhaseCreative 105698@http://www.kriesi.at/support/ <p>I have fixed question 3) Admin Bar. It was a conflict with Maintenance plugin.</p> <p>1 &amp; 2 still remain problematic. </p> http://www.kriesi.at/support/topic/info-text-ribbon-at-top-of-page-working-with-customcss#post-105621 Mon, 15 Apr 2013 10:49:18 +0000 PhaseCreative 105621@http://www.kriesi.at/support/ <p>Additionally, I really need to change the heading fonts globally, yet each page seems to have its own style override.</p> <p>What am I doing wrong? I've never had trouble working with child themes before.</p> <p>I also need to future protect the footer - I do not want a link to the theme developer on my site. And do not want to have to update this each time. </p> <p>Please tell me how I can get the child theme to work. </p> <p>Thanks. </p> http://www.kriesi.at/support/topic/info-text-ribbon-at-top-of-page-working-with-customcss#post-105618 Mon, 15 Apr 2013 10:05:10 +0000 PhaseCreative 105618@http://www.kriesi.at/support/ <p>Hi,<br /> I have 3 questions.<br /> 1) The info text ribbon in my client site maximizes each page. It's really annoying. I've tried in all browsers. I need to be able to turn the auto load off (so it only expands if someone clicks on the i) OR Make it work like the demo site where it only loads once.</p> <p>2) How can I make the custom.css work in my child theme? Can I make footer.php also work in my child theme as I need to make changes and normally run the changes through style.css in a child theme but this is not working.</p> <p>3) The admin toolbar disappears when the site is being viewed. I've checked my user settings. Is this a known bug or are there any known plugins that conflict with your theme?</p> <p>Unfortunately, I can't show you the site as it's in lock-down for client until live. I can assure you that I've updated to the latest theme files (downloaded fresh today) from the theme forest site, am running the current version of WordPress and all my plugins are up to date. </p> http://www.kriesi.at/support/topic/customcss-doesnt-work-on-mozilla-firefox#post-101730 Mon, 18 Mar 2013 03:30:04 +0000 Mr. Mask 101730@http://www.kriesi.at/support/ <p>You are the life safer Devin</p> <p>thanks </p> http://www.kriesi.at/support/topic/customcss-doesnt-work-on-mozilla-firefox#post-101728 Mon, 18 Mar 2013 02:41:14 +0000 Devin 101728@http://www.kriesi.at/support/ <p>Hi GravitatioN.</p> <p>This is the incorrect bracket which causes Firefox to ignore the css after it:<br /> <pre><code>#billing_email_field [ float: left; }</code></pre> <p>It should be:<br /> <pre><code>#billing_email_field { float: left; }</code></pre> <p>Regards,</p> <p>Devin </p> http://www.kriesi.at/support/topic/customcss-doesnt-work-on-mozilla-firefox#post-101682 Sun, 17 Mar 2013 17:50:38 +0000 Mr. Mask 101682@http://www.kriesi.at/support/ <p>Hello guys<br /> I have another problem , my custom.css doesn't work on firefox</p> <p><a href="http://markandhans.com/product-category/men" rel="nofollow">http://markandhans.com/product-category/men</a><br /> please compare this in chrome with firefox<br /> sidebar's width in firefox is different like chrome<br /> any idea? </p> http://www.kriesi.at/support/topic/social-media-fix-for-frontpage#post-97254 Mon, 18 Feb 2013 15:28:45 +0000 pwsanders 97254@http://www.kriesi.at/support/ <p>Thanks it worked perfectly!<br /> Have an excellent day </p> http://www.kriesi.at/support/topic/issue-with-fixed-social-media-buttons#post-97194 Mon, 18 Feb 2013 08:54:18 +0000 Ismael 97194@http://www.kriesi.at/support/ <p>Hi pwsanders,</p> <p>I have answered that question in this thread: <a href="http://www.kriesi.at/support/topic/social-media-fix-for-frontpage" rel="nofollow">http://www.kriesi.at/support/topic/social-media-fix-for-frontpage</a></p> <p>Regards,<br /> Ismael </p> http://www.kriesi.at/support/topic/social-media-fix-for-frontpage#post-97188 Mon, 18 Feb 2013 08:30:19 +0000 Ismael 97188@http://www.kriesi.at/support/ <p>Hi pwsanders,</p> <p>Try to replace this code:<br /> <pre><code>#top .social_bookmarks { position: fixed; top: 250px; }</code></pre> <p>with this code:<br /> <pre><code>#top .social_bookmarks { position: fixed; top: 250px !important; }</code></pre> <p>Hope this helps.</p> <p>Regards,<br /> Ismael </p> http://www.kriesi.at/support/topic/social-media-fix-for-frontpage#post-97081 Sat, 16 Feb 2013 22:15:20 +0000 pwsanders 97081@http://www.kriesi.at/support/ <p>Hey,<br /> I used the following CSS to fix my social media buttons:<br /> #top .social_bookmarks {<br /> position: fixed;<br /> top: 250px;<br /> }.home .noLightbox.social_bookmarks.icon_count_5 {<br /> top: 250px !important;<br /> }<br /> And it works on every page perfectly except for my frontpage(homepage). The buttons are fixed at the very bottom of the screen.<br /> Here is a link to the page: <a href="http://tailoredbystephenb.com/" rel="nofollow">http://tailoredbystephenb.com/</a><br /> Thanks, </p> http://www.kriesi.at/support/topic/issue-with-fixed-social-media-buttons#post-97055 Sat, 16 Feb 2013 18:19:56 +0000 pwsanders 97055@http://www.kriesi.at/support/ <p>Hey,<br /> I used the following CSS to fix my social media buttons:<br /> #top .social_bookmarks {<br /> position: fixed;<br /> top: 250px;<br /> }.home .noLightbox.social_bookmarks.icon_count_5 {<br /> top: 250px !important;<br /> }</p> <p>And it works on every page perfectly except for my frontpage(homepage). The buttons are fixed at the very bottom of the screen.<br /> Here is a link to the page: <a href="http://tailoredbystephenb.com/" rel="nofollow">http://tailoredbystephenb.com/</a></p> <p>Thanks, </p> http://www.kriesi.at/support/topic/issue-with-fixed-social-media-buttons#post-95582 Thu, 07 Feb 2013 05:55:45 +0000 Ismael 95582@http://www.kriesi.at/support/ <p>Hello,</p> <p>You can place this at the very bottom of your custom.css</p> <pre><code>.home .noLightbox.social_bookmarks.icon_count_5 { top: 250px !important; }</code></pre> <p>Regards,<br /> Ismael </p> http://www.kriesi.at/support/topic/issue-with-fixed-social-media-buttons#post-95546 Wed, 06 Feb 2013 23:34:16 +0000 tjmaxwell 95546@http://www.kriesi.at/support/ <p>Hello,</p> <p>I found a bit of code to add to my custom CSS to "fix" the social media buttons on the right:</p> <p>#top .social_bookmarks {<br /> position: fixed;<br /> top: 250px;<br /> }</p> <p>It works great for all my interior pages, but on the homepage, it's showing at the very bottom of the screen and several of the buttons get cut off. This started happening when I switched my slider type to the big full width slider. Any idea how to fix this?</p> <p><a href="http://squaresound.wpengine.com" rel="nofollow">http://squaresound.wpengine.com</a> </p> http://www.kriesi.at/support/topic/two-questions-images-custom-css#post-90276 Sun, 06 Jan 2013 18:19:38 +0000 propcellar 90276@http://www.kriesi.at/support/ <p>Thanks Nick! </p> http://www.kriesi.at/support/topic/two-questions-images-custom-css#post-89475 Wed, 26 Dec 2012 20:01:46 +0000 Nick 89475@http://www.kriesi.at/support/ <p>Mark,</p> <p>Wordpress 3.5 changed the way images are processed. Things got a lot easier. Since now, when you insert the same image into multiple locations , each time you can specify its size at the point you insert it. First of all, as a rule of thumb, you always should upload larger images then you plan on using and never smaller. If the image gets stretched out, it is because the theme expects you to tell it what you want by customizing the css, since one glove can't fit everyone, so the code has 100% width often in the css which should be changed based on how you want your pages to look, and also 100% is there to let you be aware of how large of a space theoretically you could be working with.</p> <p>In your opinion, what would be the easiest way to ensure that our images look good throughout the site without us having to photoshop each image we want to upload?</p> <p>You must have rules because if you upload photos of snakes (800width 50 height) and photos of palm trees (50width 800 height), and expect them to reside on the same page and still look good as thumbnails, then you will be disappointed. You need to have a max and min widths and heights. You need to always upload bigger so image shrinks down proportionally. If you don't crop it yourself, wordpress will happily do it for you without regard for making a nice portrait into a modern art masterpiece. If you tell Wordpress to soft crop , it will listen, but that's when the aspect ratio comes into play (snakes and palm trees)</p> <p>You should read my post where i go into detail: <a href="http://www.kriesi.at/support/topic/portfolio-fullsize-image-height#post-89178" rel="nofollow">http://www.kriesi.at/support/topic/portfolio-fullsize-image-height#post-89178</a></p> <p>In your theme, inside function.php file there are constraints (lines 18-34) . Here is where you set the dimensions of images for various locations inside the theme.</p> <p>There is also a plugin <a href="http://wordpress.org/extend/plugins/simple-image-sizes/" rel="nofollow">http://wordpress.org/extend/plugins/simple-image-sizes/</a> that you can install, and in your Settings Media folder, all the constraints will appear. You should play around with them. (yes they are frustrating as you can read by the link above to my other post) and once you understand them, its not bad. Just remember that changing constraints doesnt change anything until you upload a new image. </p> <p>thanks,</p> <p>Nick </p> http://www.kriesi.at/support/topic/two-questions-images-custom-css#post-89357 Sat, 22 Dec 2012 16:43:07 +0000 propcellar 89357@http://www.kriesi.at/support/ <p>Hey Nick,</p> <p>Thanks for the help. You mention that I can specify settings for image locations and whether or not images are cropped or not. Where and how would I set those settings?</p> <p>In your opinion, what would be the easiest way to ensure that our images look good throughout the site without us having to photoshop each image we want to upload?</p> <p>Also, any insight into the reason why the image transitions are the way they are? (reference #3 above)</p> <p>Thanks again,</p> <p>Mark </p> http://www.kriesi.at/support/topic/two-questions-images-custom-css#post-89307 Sat, 22 Dec 2012 07:48:48 +0000 Nick 89307@http://www.kriesi.at/support/ <p>Hi,</p> <p>It all depends what you put as your image size settings in functions.php. You can have specific settings for certain image locations within the theme (portfolio, blog, etc.) and you specify the constraints and whether the image should be cropped or keep its aspect ratio once the constraint width and height are reached. Its always a good idea to upload images that are in a consistent size for certain locations, </p> <p>Because if half the images you upload are smaller then the constraints for portfolio images lets say, and the other half are larger then the constraints, the end result is likely to be inferior to one that consistently uses images larger than the constraints.</p> <p>3) You are scaling a square into a rectangle, thus causing a distortion. In the functions.php file take a look at this line</p> <pre><code>$avia_config[&#39;imgSize&#39;][&#39;portfolio2&#39;] = array(&#39;width&#39;=&gt;450, &#39;height&#39;=&gt;300); // medium preview pic for 2 column portfolio and small 3d slider</code></pre> <p>That is the exact size that the 1200x1200 image scales down to. if you change that into a square shape and continue to upload square images, you will not have an issue. If you don't want to prep your images then you have to depend on the auto crop abilities of Wordpress.</p> <p>Thanks,</p> <p>Nick </p> http://www.kriesi.at/support/topic/two-questions-images-custom-css#post-89189 Fri, 21 Dec 2012 03:42:52 +0000 propcellar 89189@http://www.kriesi.at/support/ <p>Hey Devin,</p> <p>Thanks for your quick reply. </p> <p>1) We are still in the very early stages of setting up the website so I've only got a couple of images in the portfolio. Both images are 1024x1024. Am I going to need multiple copies of the same image in different sizes or is it supposed to scale the one uploaded image to fit any container? I have found that I can change the height: auto instead of 100% and it gets rid of the distortion, but this only works in the 2 column grid view. Any other ideas? </p> <p>2) Thanks. I'll put all my CSS there.</p> <p>3) We are currently in Maintenance Mode for now until we get the kinks worked out and the content added. I'll make it live for you to check out the problem. Here is the link: <a href="http://tinyurl.com/btzo5pj" rel="nofollow">http://tinyurl.com/btzo5pj</a>. The image only slightly distorted on this page because the container is almost square. It is even more distorted in the slideshow when "read more" is selected. You'll also be able to see the strange transition between images.</p> <p>Thanks again for the help. </p> http://www.kriesi.at/support/topic/two-questions-images-custom-css#post-89134 Thu, 20 Dec 2012 18:40:55 +0000 Devin 89134@http://www.kriesi.at/support/ <p>Hi propcellar,</p> <p>1) Images for the portfolio should be at least 930px (690px for the no feature size) wide to prevent distortion in the slideshow container. Bigger for the homepage slider size to get the same effect as the demo. For example, here is the initial image used in the demo: <a href="http://www.kriesi.at/themes/velvet/files/2011/06/iStock_000006026401Medium-1300x1047.jpg" rel="nofollow">http://www.kriesi.at/themes/velvet/files/2011/06/iStock_000006026401Medium-1300x1047.jpg</a></p> <p>2) You can add css to the Quick CSS field in the theme options &gt;Layout &amp; Styling.</p> <p>3) I don't see this happening in the demo or on my local installation. Do you have an example of where this is happening? It sounds like it might be related to not using images that are big enough for the slideshow area.</p> <p>Regards,</p> <p>Devin </p> http://www.kriesi.at/support/topic/two-questions-images-custom-css#post-89027 Thu, 20 Dec 2012 02:31:50 +0000 propcellar 89027@http://www.kriesi.at/support/ <p>Sorry...one more question...</p> <p>3) When the image in the slideshow changes, it is initially shown at it's original size. This has the effect of only showing a small portion of the image before it gets scaled to fit the container. How to I keep this from happening. It's very distracting and annoying.</p> <p>Thanks again. </p>