http://www.kriesi.at/support/tags/image Support Forum - Tag: image - Recent Posts en-US Tue, 21 May 2013 09:18:15 +0000 http://bbpress.org/?v=1.0.2 q http://www.kriesi.at/support/search.php http://www.kriesi.at/support/topic/insert-image-above-content-and-below-menu#post-112578 Tue, 21 May 2013 05:42:55 +0000 Dux 112578@http://www.kriesi.at/support/ <p>I think I figured out how to do this with some PHP in the header that calls up the image based off the page ID. I will update once I test it further with and reach a final outcome. Thanks again. </p> http://www.kriesi.at/support/topic/insert-image-above-content-and-below-menu#post-112527 Mon, 20 May 2013 19:01:16 +0000 Dux 112527@http://www.kriesi.at/support/ <p>Further research shows this can be done with a few different WP plugins but the Abundance theme doesn't support custom headers from the way it looks. Thanks for the input Devin. </p> http://www.kriesi.at/support/topic/insert-image-above-content-and-below-menu#post-112462 Mon, 20 May 2013 15:30:08 +0000 Devin 112462@http://www.kriesi.at/support/ <p>Hi Dux,</p> <p>I'm not really sure how they added that in. It could have been done in the header.php file or even the page.php but it doesn't look like anything from the theme features.</p> <p>What you could do, is use page template from the Template Builder and create layouts similar to that though they would be using the themes slideshow at the top instead of the kind of image that is custom added in.</p> <p>Regards,</p> <p>Devin </p> http://www.kriesi.at/support/topic/insert-image-above-content-and-below-menu#post-112325 Mon, 20 May 2013 04:08:10 +0000 Dux 112325@http://www.kriesi.at/support/ <p>Using the Abundance theme, I would like to insert an image below the mega menu and above the main content container. I am seeing this being done with another Abundance page that I found (see link below) but I cannot seem to figure out how they are accomplishing this. It appears that the change is being performed using header.php. I would also like the flexibility of doing this on a per page basis somehow. Meaning I would like to have the ability to change that image for individual pages. Any help is greatly appreciated. Loving the Abundance theme.</p> <p>Link to example page<br /> <a href="http://www.camelbackhealth.com/about-camelback-health-care/" rel="nofollow">http://www.camelbackhealth.com/about-camelback-health-care/</a> </p> http://www.kriesi.at/support/topic/is-there-a-method-within-aries-or-enfold-that-allows-a-full-background-picture#post-112307 Mon, 20 May 2013 02:55:13 +0000 Ismael 112307@http://www.kriesi.at/support/ <p>Hi,</p> <p>Yep, create a blank page. Then add this on your custom.css. Inspect page using Chrome or Firebug for FF, look for the unique body class.</p> <pre><code>#top.avia-blank.page-id-1236 #wrap_all { background: red url(../images/background-images/Abducted.jpg) !important; }</code></pre> <p>Mine is .page-id-1236. You might need a fairly large image for this to cope up to the theme's responsiveness or use a pattern.</p> <p>Regards,<br /> Ismael </p> http://www.kriesi.at/support/topic/is-there-a-method-within-aries-or-enfold-that-allows-a-full-background-picture#post-112247 Sun, 19 May 2013 19:12:26 +0000 MikehJPP 112247@http://www.kriesi.at/support/ <p>On the blank page (or any individual page)...I suppose I can set the background-image via div class?</p> <p>Thanks in advance. </p> http://www.kriesi.at/support/topic/images-and-text-jumps-when-moused-over#post-112143 Sat, 18 May 2013 13:12:12 +0000 Jasmine Lovelstzy 112143@http://www.kriesi.at/support/ <p>No problem Peter will post a new topic.</p> <p>thx<br /> jasmine </p> http://www.kriesi.at/support/topic/images-and-text-jumps-when-moused-over#post-112110 Sat, 18 May 2013 07:04:05 +0000 Dude 112110@http://www.kriesi.at/support/ <p>No, that's another issue imo. You can try it but it seems like the jumping image issue is related to the display attribute (display:inline vs display:block-inline). please do not use this thread for your questions - I don't want to mix things up. </p> http://www.kriesi.at/support/topic/images-and-text-jumps-when-moused-over#post-111977 Fri, 17 May 2013 16:59:43 +0000 jaypopsu 111977@http://www.kriesi.at/support/ <p>Same issue as you Jasmine: <a href="http://www.kriesi.at/support/topic/problem-when-hover-on-image-alignement-with-firefox-and-opera-mac" rel="nofollow">http://www.kriesi.at/support/topic/problem-when-hover-on-image-alignement-with-firefox-and-opera-mac</a></p> <p>Also wondering if this is the fix. My issue only occurred in FF and not Chrome. </p> http://www.kriesi.at/support/topic/images-and-text-jumps-when-moused-over#post-111959 Fri, 17 May 2013 15:53:53 +0000 Jasmine Lovelstzy 111959@http://www.kriesi.at/support/ <p>I think this is the same/similar problem. </p> <p>- Firefox only: An image uploaded via Advanced Layout Editor goes from right to left after clicked or hoovered: </p> <p>Screenshot: <a href="http://demo.globalads24.com/wp-content/uploads/2013/05/Picture26adj.jpg" rel="nofollow">http://demo.globalads24.com/wp-content/uploads/2013/05/Picture26adj.jpg</a> </p> <p>Live site: <a href="http://babyblueshelp.com" rel="nofollow">http://babyblueshelp.com</a> </p> <p>Can we use the same code or wait for the updated version?</p> <p>thx<br /> jasmine </p> http://www.kriesi.at/support/topic/images-and-text-jumps-when-moused-over#post-111953 Fri, 17 May 2013 15:27:19 +0000 Dude 111953@http://www.kriesi.at/support/ <p>Open up the /js/avia.js file in your enfold folder, find lines 245-287 that look like:</p> <pre><code>elements.on(&#39;mouseenter&#39;, function(e) { var link = $(this), current = link.find(&#39;img:first&#39;), url = link.attr(&#39;href&#39;), span_class = &quot;overlay-type-video&quot;, opa = 0.7; overlay = link.find(&#39;.image-overlay&#39;); if(!overlay.length) { if(current.outerHeight() &gt; 100) { if(link.height() == 0) { link.addClass(current.get(0).className); current.get(0).className = &quot;&quot;; } if(!link.css(&#39;position&#39;) || link.css(&#39;position&#39;) == &#39;static&#39;) { link.css({position:&#39;relative&#39;, overflow:&#39;hidden&#39;}); } if(!link.css(&#39;display&#39;) || link.css(&#39;display&#39;) == &#39;inline&#39;) { link.css({display:&#39;inline-block&#39;}); } if( url.match(/(jpg|gif|jpeg|png|tif)/) ) span_class = &quot;overlay-type-image&quot;; if(!url.match(/(jpg|gif|jpeg|png|\.tif|\.mov|\.swf|vimeo\.com|youtube\.com)/) ) span_class = &quot;overlay-type-extern&quot;; overlay = $(&quot;&lt;span class=&#39;image-overlay &quot;+span_class+&quot;&#39; style=&#39;opacity: 0;&#39;&gt;&lt;span class=&#39;image-overlay-inside&#39;&gt;&lt;/span&gt;&lt;/span&gt;&quot;).appendTo(link); } } if(current.outerHeight() &gt; 100) { overlay.css({left:current.position().left + parseInt(current.css(&quot;margin-left&quot;),10), top:current.position().top + parseInt(current.css(&quot;margin-top&quot;),10)}) .css({display:&#39;block&#39;,&#39;height&#39;:current.outerHeight(),&#39;width&#39;:current.outerWidth()}).stop().animate({opacity:opa}, 400); } else { overlay.css({display:&quot;none&quot;}); } }).on(&#39;mouseleave&#39;, elements, function(){ if(overlay.length) { overlay.stop().animate({opacity:0}, 400); } });</code></pre> <p>and replace the entire block above with the block below</p> <pre><code>elements.each(function(e) { var link = $(this), current = link.find(&#39;img:first&#39;), url = link.attr(&#39;href&#39;), span_class = &quot;overlay-type-video&quot;; overlay = link.find(&#39;.image-overlay&#39;); if(!overlay.length) { if(link.height() == 0) { link.addClass(current.get(0).className); current.get(0).className = &quot;&quot;; } if(!link.css(&#39;position&#39;) || link.css(&#39;position&#39;) == &#39;static&#39;) { link.css({position:&#39;relative&#39;, overflow:&#39;hidden&#39;}); } if(!link.css(&#39;display&#39;) || link.css(&#39;display&#39;) == &#39;inline&#39;) { link.css({display:&#39;inline-block&#39;}); } if( url.match(/(jpg|gif|jpeg|png|tif)/) ) span_class = &quot;overlay-type-image&quot;; if(!url.match(/(jpg|gif|jpeg|png|\.tif|\.mov|\.swf|vimeo\.com|youtube\.com)/) ) span_class = &quot;overlay-type-extern&quot;; overlay = $(&quot;&lt;span class=&#39;image-overlay &quot;+span_class+&quot;&#39; style=&#39;opacity: 0;&#39;&gt;&lt;span class=&#39;image-overlay-inside&#39;&gt;&lt;/span&gt;&lt;/span&gt;&quot;).appendTo(link); } }); elements.on(&#39;mouseenter&#39;, function(e) { var link = $(this), current = link.find(&#39;img:first&#39;), opa = 0.7; overlay = link.find(&#39;.image-overlay&#39;); if(current.outerHeight() &gt; 100) { overlay.css({left:current.position().left + parseInt(current.css(&quot;margin-left&quot;),10), top:current.position().top + parseInt(current.css(&quot;margin-top&quot;),10)}) .css({display:&#39;block&#39;,&#39;height&#39;:current.outerHeight(),&#39;width&#39;:current.outerWidth()}).stop().animate({opacity:opa}, 400); } else { overlay.css({display:&quot;none&quot;}); } }).on(&#39;mouseleave&#39;, elements, function(){ if(overlay.length) { overlay.stop().animate({opacity:0}, 400); } });</code></pre> <p>I'll ask Kriesi to implement this fix in the next version. </p> http://www.kriesi.at/support/topic/images-and-text-jumps-when-moused-over#post-111876 Fri, 17 May 2013 05:31:10 +0000 graphmaster 111876@http://www.kriesi.at/support/ <p>My images jump too. I added them through the Add Media when editing in display mode. I am not using columns, so how do I stop the jumping? It does it in Chrome, IE and Firefox.... </p> http://www.kriesi.at/support/topic/images-and-text-jumps-when-moused-over#post-111865 Fri, 17 May 2013 05:14:41 +0000 Ismael 111865@http://www.kriesi.at/support/ <p>Hi.</p> <p>Yeah, noticed it. I'm not sure if this will work. Add this on your custom.css</p> <pre><code>post-entry-11 .flex_column.av_one_third .avia_textblock p { margin: 0.85em 0 !important; }</code></pre> <pre><code>.post-entry-11 .flex_column.av_one_third { min-height: 203px !important; }</code></pre> <p>How did you add them anyway?</p> <p>Regards,<br /> Ismael </p> http://www.kriesi.at/support/topic/images-and-text-jumps-when-moused-over#post-111727 Thu, 16 May 2013 19:19:01 +0000 johnball 111727@http://www.kriesi.at/support/ <p>Thank you.</p> <p>Images and text still jump though. Do you have a solution for that?</p> <p><a href="http://dure.ballmedia.com/" rel="nofollow">http://dure.ballmedia.com/</a> </p> http://www.kriesi.at/support/topic/images-and-text-jumps-when-moused-over#post-111533 Thu, 16 May 2013 01:13:28 +0000 Ismael 111533@http://www.kriesi.at/support/ <p>Hi, </p> <p>Please use this instead. It will render a transparent box and leave the circle behind. :)</p> <pre><code>.image-overlay.overlay-type-extern { background: transparent; }</code></pre> <p>Regards,<br /> Ismael </p> http://www.kriesi.at/support/topic/images-and-text-jumps-when-moused-over#post-111431 Wed, 15 May 2013 17:05:50 +0000 johnball 111431@http://www.kriesi.at/support/ <p>That removed the white box, however, the image and text still 'jump' down when moused over in Firefox. In Safari, the logo moves slightly, but the text still jumps down.</p> <p>Is there a way to remedy this?</p> <p>I liked the 'circle' when moused over. Acted as a prompt. Is there a way to get that back without the white box? </p> http://www.kriesi.at/support/topic/images-and-text-jumps-when-moused-over#post-110147 Thu, 09 May 2013 21:01:32 +0000 Ismael 110147@http://www.kriesi.at/support/ <p>Hi,</p> <p>Might as well remove the circle because it is nested inside the box. You can add this on your custom.css</p> <pre><code>.image-overlay.overlay-type-extern { display: none !important; }</code></pre> <p>Regards,<br /> Ismael </p> http://www.kriesi.at/support/topic/images-and-text-jumps-when-moused-over#post-110140 Thu, 09 May 2013 20:31:52 +0000 johnball 110140@http://www.kriesi.at/support/ <p>A few concerns to address: </p> <p>My homepage has three logo images under the banner that jump downwards when you hover over them. The text spacing also jumps a little bit further away from the logos too. Is there a way to prevent them moving? Since I'm using a dark background, can I eliminate the 'white box' that shows when hovering over these logos? The circle is fine, but the box doesn't work here.</p> <p><a href="http://dure.ballmedia.com/" rel="nofollow">http://dure.ballmedia.com/</a> </p> http://www.kriesi.at/support/topic/gallery-thumbnail-size#post-110131 Thu, 09 May 2013 19:39:28 +0000 vagsera 110131@http://www.kriesi.at/support/ <p>Thanx! Worked perfect. I also used it to resize the Slider. </p> http://www.kriesi.at/support/topic/2-image-questions-when-using-shortcode-generator#post-109747 Wed, 08 May 2013 13:01:04 +0000 Devin 109747@http://www.kriesi.at/support/ <p>Hi JP,</p> <p>Set the link to Link manually and then add the image url to that link. </p> <p>As for alt text, no not that I know of at the moment.</p> <p>Regards,</p> <p>Devin </p> http://www.kriesi.at/support/topic/2-image-questions-when-using-shortcode-generator#post-109491 Tue, 07 May 2013 13:41:10 +0000 jaypopsu 109491@http://www.kriesi.at/support/ <p>When inserting an image using the Insert Shortcode &gt; Media Elements &gt; Image option. Is there any way to add alternative text? Maybe after, in the code itself.</p> <p>Also, when using this method, the light box affect no longer works. Is there a way to turn that on as well for the image?</p> <p>Thanks,<br /> JP </p> http://www.kriesi.at/support/topic/hover-over-image-breaks-word-wrap#post-109278 Mon, 06 May 2013 15:33:24 +0000 jaypopsu 109278@http://www.kriesi.at/support/ <p>Thanks so much. I just got back to work and tried it and am not having the issue. All I can think is that it was a cached problem.</p> <p>Thanks again for looking at it. I appreciate your patience.</p> <p>JP </p> http://www.kriesi.at/support/topic/hover-over-image-breaks-word-wrap#post-108940 Sun, 05 May 2013 03:17:18 +0000 Devin 108940@http://www.kriesi.at/support/ <p>Very strange. I've tried to replicate it now in all of my available browsers in various browser states and am still not getting it. </p> http://www.kriesi.at/support/topic/hover-over-image-breaks-word-wrap#post-108761 Fri, 03 May 2013 17:40:24 +0000 jaypopsu 108761@http://www.kriesi.at/support/ <p>OK, just tested. I opened a new FF, cleared cache, went directly to site by typing in url <a href="http://polettofit.com/2013/what-is-ultimate-reset" rel="nofollow">http://polettofit.com/2013/what-is-ultimate-reset</a> and it happens. They only time it doesn't happen is when I click on a link that I provide you in this thread, wth?</p> <p>I'm going to test to see if it does it by clicking on the link I just put in this reply. </p> http://www.kriesi.at/support/topic/hover-over-image-breaks-word-wrap#post-108760 Fri, 03 May 2013 17:37:28 +0000 jaypopsu 108760@http://www.kriesi.at/support/ <p>Alright, just to add. I clicked on the links that I provided and it opened a new tab and the "affect" doesn't do it. However, I have those pages open in another tab and it does it. Now I'm really confused. Any suggestions? </p> http://www.kriesi.at/support/topic/hover-over-image-breaks-word-wrap#post-108759 Fri, 03 May 2013 17:34:31 +0000 jaypopsu 108759@http://www.kriesi.at/support/ <p>I just tested it at home, on a Mac, using both Chrome and FF. I originally posted from work where I'm on a PC and it happens in both Chrome and FF. It happens when I'm logged in to WP and when I'm not logged in.</p> <p>I honestly have no idea how it's not do that for you.</p> <p>When I just move the mouse over any of those images, they move and the text "adjusts". </p> http://www.kriesi.at/support/topic/disable-lightbox-on-text-links-to-image#post-108472 Thu, 02 May 2013 16:29:43 +0000 Dude 108472@http://www.kriesi.at/support/ <p>Hey! </p> <p> Please add a noLightbox class to the links like:<br /> <pre><code>&lt;a href=&quot;myimage.jpg&quot; class=&quot;noLightbox&quot;&gt;My link text&lt;/a&gt;</code></pre> <p> Regards,<br /> Peter </p> http://www.kriesi.at/support/topic/hover-over-image-breaks-word-wrap#post-108442 Thu, 02 May 2013 15:03:42 +0000 Devin 108442@http://www.kriesi.at/support/ <p>Hi jaypopsu,</p> <p>I'm not getting that effect at all when viewing those pages. Is it happening in a specific browser or OS? </p> <p>Regards,</p> <p>Devin </p> http://www.kriesi.at/support/topic/disable-lightbox-on-text-links-to-image#post-108379 Thu, 02 May 2013 12:05:11 +0000 hotspot 108379@http://www.kriesi.at/support/ <p>Hi There,</p> <p>We have some images that are available for download.<br /> So we have a text that links to the image in a new page (target="_blank)<br /> When we do so the image is atomatically opened in lightbox, we notices in the code it automatically gets: rel="lightbox[auto_group1]"<br /> How can we disable that so the text link will just open the image in a blank page....</p> <p>This only happens with .jpeg files, with .pdf we get the behaviour we want.</p> <p>Any ideas? </p> http://www.kriesi.at/support/topic/hover-over-image-breaks-word-wrap#post-108274 Wed, 01 May 2013 20:38:41 +0000 jaypopsu 108274@http://www.kriesi.at/support/ <p>Sure, just hover over any of the images on these pages, or anywhere on my site:</p> <p><a href="http://polettofit.com/2013/what-is-ultimate-reset/" rel="nofollow">http://polettofit.com/2013/what-is-ultimate-reset/</a></p> <p><a href="http://polettofit.com/about/" rel="nofollow">http://polettofit.com/about/</a> </p>