Support Forum - Tag: iconbox

Support Forum - Tag: iconbox - Recent Posts http://www.kriesi.at/support/tags/iconbox Support Forum - Tag: iconbox - Recent Posts en-US Wed, 22 May 2013 14:46:37 +0000 http://bbpress.org/?v=1.0.2 <![CDATA[Search]]> q http://www.kriesi.at/support/search.php Dude on "Iconbox - Add Icon numbers" http://www.kriesi.at/support/topic/iconbox-add-icon-numbers#post-108106 Wed, 01 May 2013 05:39:20 +0000 Dude 108106@http://www.kriesi.at/support/ Afaik not because fontello.com ( <a href="http://fontello.com/" rel="nofollow">http://fontello.com/</a> ) does not offer a icon set which contains numbers and we use this service for the icon font. However you can suggest the feature here: <a href="http://www.kriesi.at/support/topic/enfold-feature-requests/page/2" rel="nofollow">http://www.kriesi.at/support/topic/enfold-feature-requests/page/2</a> Hanniball on "Iconbox - Add Icon numbers" http://www.kriesi.at/support/topic/iconbox-add-icon-numbers#post-108043 Tue, 30 Apr 2013 18:57:32 +0000 Hanniball 108043@http://www.kriesi.at/support/ Hey there, is there a way to add icons with a number to the already existing ones? I def. need four boxes from 1 - 4 in the title. How can I change / add this? Hanniball achieve1 on "Iconbox Title with link" http://www.kriesi.at/support/topic/iconbox-title-with-link#post-104927 Tue, 09 Apr 2013 13:17:37 +0000 achieve1 104927@http://www.kriesi.at/support/ Ok thank you Devin! Devin on "Iconbox Title with link" http://www.kriesi.at/support/topic/iconbox-title-with-link#post-104914 Tue, 09 Apr 2013 12:25:29 +0000 Devin 104914@http://www.kriesi.at/support/ Hi achieve1, No, not that I know of but I can put in the idea to Kriesi as a feature request. Regards, Devin achieve1 on "Iconbox Title with link" http://www.kriesi.at/support/topic/iconbox-title-with-link#post-104629 Sat, 06 Apr 2013 19:07:45 +0000 achieve1 104629@http://www.kriesi.at/support/ Hello! Is there a way to make an iconbox title clickable to another page on the site? Thanks for all the support! Nick on "Iconbox Retina Image Replacement" http://www.kriesi.at/support/topic/iconbox-retina-image-replacement#post-99966 Thu, 07 Mar 2013 04:04:13 +0000 Nick 99966@http://www.kriesi.at/support/ Hi, Ahh. I am sorry, thought this was about the main page. Now that we are on the same page, On the recipes page you showed above, the image of the icon itself is in the html which is not as favorable to the media query approach to doing this. Need either a jquery solution or to detect retina via php where the short-code is executed. I looked for some jquery for retina replace ( <a href="https://github.com/leonsmith/retina-replace-js" rel="nofollow">https://github.com/leonsmith/retina-replace-js</a> ) but all i find assumes that both the retina image and the normal image are defined inside css so the classes can be switched. Also there are no distinguishing classes to grab an individual icon, since the code is same for all of them. Here is actually a good solution <pre><code><html> <head> <style type="text/css"> .image_1_5x, .image_2x{ display: none; } @media only screen and (min--moz-device-pixel-ratio: 1.5 ), only screen and (-webkit-min-device-pixel-ratio: 1.5 ), only screen and (min-device-pixel-ratio: 1.5 ), only screen and (-o-min-device-pixel-ratio: 3/2){ .image_1x, .image_2x{ display: none; } .image_1.5x{ display: block; } } @media only screen and (min--moz-device-pixel-ratio: 2 ), only screen and (-webkit-min-device-pixel-ratio: 2 ), only screen and (min-device-pixel-ratio:2 ), only screen and (-o-min-device-pixel-ratio: 2/1){ .image_1x, .image_1_5x{ display: none; } .image_2x{ display: block; } } </style> </head> <body> <img src="kinkakuji.jpg" width="320px" class="image_1x"/> <img src="kinkakuji@1.5x.jpg" width="320px" class="image_1_5x"/> <img src="kinkakuji@2x.jpg" width="320px" class="image_2x"/> </body> </html></code></pre> Thanks, Nick Lindsey on "Iconbox Retina Image Replacement" http://www.kriesi.at/support/topic/iconbox-retina-image-replacement#post-99917 Wed, 06 Mar 2013 22:50:41 +0000 Lindsey 99917@http://www.kriesi.at/support/ Hi Nick, Thank you for your patience with me! :) This is actually the smoothie page that I'm referring to - not on the homepage - : <a href="http://www.toxicfreechallenge.com/recipes/strawberry-festival-smoothie/" rel="nofollow">http://www.toxicfreechallenge.com/recipes/strawberry-festival-smoothie/</a> The icons are coded differently than the home page where I didn't use the iconbox shortcodes. The icons on this page are shortcodes and the span class I see in Google Chrome is "iconbox_icon", not "smoothie". <pre><code>[iconbox title="Fruits:" icon="fruits.png"] <ul> <li>1 teaspoon lemon zest, grated</li> <li>3 cups strawberries</li> </ul> [/iconbox]</code></pre> Just to clarify, are you saying I should replace this shortcode (as well as the other shortcodes) [iconbox title="Fruits:" icon="fruits.png"] on each of my 125 pages with this? <code></code> Thanks for your patience!! - Lindsey Nick on "Iconbox Retina Image Replacement" http://www.kriesi.at/support/topic/iconbox-retina-image-replacement#post-99864 Wed, 06 Mar 2013 18:49:17 +0000 Nick 99864@http://www.kriesi.at/support/ Hi, Try this <pre><code>#top span.smoothie{ background: url("http://www.toxicfreechallenge.com/wp-content/themes/propulsion/images/icons/iconbox/fruits.png") no-repeat scroll 0 0 transparent; display: inline; height: 149px; left: 0; padding-left: 60px; padding-top: 20px; padding-bottom: 10px; width: 48px; } @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and ( min--moz-device-pixel-ratio: 2), only screen and ( -o-min-device-pixel-ratio: 2/1), only screen and ( min-device-pixel-ratio: 2), only screen and ( min-resolution: 192dpi), only screen and ( min-resolution: 2dppx) { #top span.smoothie{ background: url("http://www.toxicfreechallenge.com/wp-content/themes/propulsion/images/icons/iconbox/fruits@2x.png")no-repeat scroll 0 0 transparent; } }</code></pre> and you would call it from your pages like this. h6 is not relevant here. I tested this on your site with google dev tools, and I am seeing the icon. Just make sure you have the retina icon where the url points and change the names for your icons. Iconbox is just a name of a folder , if you like you can change it to foobar, there is no need to get fixated with that name. <pre><code></code></pre> Thanks, Nick Lindsey on "Iconbox Retina Image Replacement" http://www.kriesi.at/support/topic/iconbox-retina-image-replacement#post-99717 Wed, 06 Mar 2013 00:45:53 +0000 Lindsey 99717@http://www.kriesi.at/support/ Thank you, Dude! He wrote back that he decided not to provide support via email, except if it is paid. He also said: "iconbox" seems to be a shortcode of your theme. Not sure if the images (icons) are from you, but if they aren't there are probably shipped with the theme and if they don't provide bigger version, well, you will have to use new ones, and probably to modify your theme code a bit. To which I wrote that I understood not providing unpaid support, as his plugin was free, and I noted that I designed my shortcode iconbox icons and they're in vector format. He replied that if they are in vector formats, I can use SVG versions of them for the website and it will work automatically in Retina. If they are part of the theme, we shouldn't have them in the Media, they should actually be "outside" WordPress, with the @2x generated manually by you. Then in the CSS (device-pixel-ratio: 2), you specify the @2x files. He also said his plugin should cover the posts and all, not the images related to the themes. The themes should handle Retina themselves (since they often provides the icons and main images). I've never added SVG files to CSS although I have added @2x in media queries so I have to figure this next step out. - Lindsey Dude on "Iconbox Retina Image Replacement" http://www.kriesi.at/support/topic/iconbox-retina-image-replacement#post-99557 Tue, 05 Mar 2013 09:40:19 +0000 Dude 99557@http://www.kriesi.at/support/ Hi! Please report back if the plugin author provided a solution (or not). Best regards, Peter Lindsey on "Iconbox Retina Image Replacement" http://www.kriesi.at/support/topic/iconbox-retina-image-replacement#post-99479 Mon, 04 Mar 2013 21:36:24 +0000 Lindsey 99479@http://www.kriesi.at/support/ Thanks for helping, Nick! I tried your suggestion and to no avail. Then realized the .smoothie is actually coded in HTML as a class of the H6 tag, not an iconbox shortcode. I had setup WP Retina 2x when you suggested it previously and it is a wonderful plugin but doesn't show my shortcodes in the dashboard. I have emailed the creator, Jordy Meow to see if he can advise a solution or a reason as to why I don't see the images in the WP Retina 2x dashboard. I will update you as soon as I hear from him. Thanks so much for always kindly helping me! - Lindsey Nick on "Iconbox Retina Image Replacement" http://www.kriesi.at/support/topic/iconbox-retina-image-replacement#post-99182 Sun, 03 Mar 2013 00:44:35 +0000 Nick 99182@http://www.kriesi.at/support/ Hi, There is a plugin that does that quite easily with shortcodes <a href="http://wordpress.org/extend/plugins/wp-retina-2x/" rel="nofollow">http://wordpress.org/extend/plugins/wp-retina-2x/</a> Your media query looks alright to me but I don't like how you are targeting , please try this instead as it has the same styling as the smoothie icon on your home page. <pre><code>#top span.smoothie{ background: url("http://www.toxicfreechallenge.com/wp-content/themes/propulsion/images/icons/iconbox/fruits@2x.png") no-repeat scroll 0 0 transparent; display: inline; height: 149px; left: 0; padding-left: 60px; padding-top: 20px; padding-bottom: 10px; width: 48px; }</code></pre> Thanks, Nick Lindsey on "Iconbox Retina Image Replacement" http://www.kriesi.at/support/topic/iconbox-retina-image-replacement#post-99068 Fri, 01 Mar 2013 20:30:00 +0000 Lindsey 99068@http://www.kriesi.at/support/ Hi Team! I'm trying to target an icon box to replace it's image with retina in my media query. I've tried targeting an icon box a few different ways: @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and ( min--moz-device-pixel-ratio: 2), only screen and ( -o-min-device-pixel-ratio: 2/1), only screen and ( min-device-pixel-ratio: 2), only screen and ( min-resolution: 192dpi), only screen and ( min-resolution: 2dppx) { .iconbox_icon.fruits{ background:url("../images/icons/iconbox/fruits@2x.png") no-repeat; background-size: 50%; padding-top: 20px !important; } .iconbox span.fruits { background:url("../images/icons/iconbox/fruits@2x.png") no-repeat; background-size: 50%; padding-top: 20px !important; } .iconbox.iconbox_icon.fruits { background:url("../images/icons/iconbox/fruits@2x.png") no-repeat; background-size: 50%; padding-top: 20px !important; } .iconbox.iconbox_icon span.fruits { background:url("../images/icons/iconbox/fruits@2x.png") no-repeat; background-size: 50%; padding-top: 20px !important; } .iconbox span.fruits { background:url("../images/icons/iconbox/fruits@2x.png") no-repeat; background-size: 50%; padding-top: 20px !important; } .iconbox_icon span.fruits { background:url("../images/icons/iconbox/fruits@2x.png") no-repeat; background-size: 50%; padding-top: 20px !important; } } I have even tried .iconbox span.fruits[icon="fruits.png"] (just an idea) but to no avail. I'd really like to have retina for each icon box, as I have several icons, not just a fruits icon but several others. How do you suggest to target these? Thank you kindly!! - Lindsey Devin on "iconbox title color" http://www.kriesi.at/support/topic/iconbox-title-color#post-84235 Fri, 16 Nov 2012 15:25:04 +0000 Devin 84235@http://www.kriesi.at/support/ Glad we could help :) Regards, Devin MattiaParla on "iconbox title color" http://www.kriesi.at/support/topic/iconbox-title-color#post-84058 Thu, 15 Nov 2012 11:03:24 +0000 MattiaParla 84058@http://www.kriesi.at/support/ IT WORKS! Thank you very much Devin. Have a nice day. M Devin on "iconbox title color" http://www.kriesi.at/support/topic/iconbox-title-color#post-83960 Wed, 14 Nov 2012 19:39:35 +0000 Devin 83960@http://www.kriesi.at/support/ Hi M, I'm not sure if this is what you were looking for buy 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.home .iconbox_top_content_title { color: #444; }</code></pre> You can change the color by changing the #444 to the color code of your choice. Regards, Devin MattiaParla on "iconbox title color" http://www.kriesi.at/support/topic/iconbox-title-color#post-83877 Wed, 14 Nov 2012 13:33:49 +0000 MattiaParla 83877@http://www.kriesi.at/support/ anyone, by chance has read my question? Thank you M MattiaParla on "iconbox title color" http://www.kriesi.at/support/topic/iconbox-title-color#post-83724 Tue, 13 Nov 2012 19:08:16 +0000 MattiaParla 83724@http://www.kriesi.at/support/ I would like change the color of the three boxes "welcome"dummy data that are in home page: "Chi siamo", "I nostri prodotti", "Perchè scegliere noi" [iconbox_top title="Chi siamo" icon="Speech_Bubble.png"]Lorem ipsum dolor sit amet, consectetur adipisicing elit [one_third] [iconbox_top title="I nostri prodotti" icon="Chart_8.png"]Lorem ipsum dolor sit amet, consectetur adipisicing elit [iconbox_top title="Perchè scegliere noi" icon="Key_2.png"]Lorem ipsum dolor sit amet, consectetur adipisicing elit ThakThank you in advanced M Devin on "iconbox title color" http://www.kriesi.at/support/topic/iconbox-title-color#post-83708 Tue, 13 Nov 2012 18:10:06 +0000 Devin 83708@http://www.kriesi.at/support/ Hi MattiaParla, Can you point us to an example of the title on your site or the demo? The css will need to be specific so that it doesn't change any other title color across the site. Regards, Devin MattiaParla on "iconbox title color" http://www.kriesi.at/support/topic/iconbox-title-color#post-83644 Tue, 13 Nov 2012 15:18:53 +0000 MattiaParla 83644@http://www.kriesi.at/support/ Hi to everyone, do you know how to change the color of iconbox_top title that appear in the home? Thank you in advanced M Devin on "Add more icons to icon buttons shortcode" http://www.kriesi.at/support/topic/add-more-icons-to-icon-buttons-shortcode#post-54031 Mon, 30 Apr 2012 21:12:01 +0000 Devin 54031@http://www.kriesi.at/support/ Glad that helped! Let us know if you need anything else :) reganfrank on "Add more icons to icon buttons shortcode" http://www.kriesi.at/support/topic/add-more-icons-to-icon-buttons-shortcode#post-54026 Mon, 30 Apr 2012 20:59:54 +0000 reganfrank 54026@http://www.kriesi.at/support/ @Mya Thanks a stack, that really helps. Regards, Regan Mya on "Center Alignment for Icon Box?" http://www.kriesi.at/support/topic/center-alignment-for-icon-box#post-53568 Thu, 26 Apr 2012 18:54:53 +0000 Mya 53568@http://www.kriesi.at/support/ Great! Glad Devin and Ismael were able to help! Regards, Mya commonmodel on "Center Alignment for Icon Box?" http://www.kriesi.at/support/topic/center-alignment-for-icon-box#post-53566 Thu, 26 Apr 2012 18:44:33 +0000 commonmodel 53566@http://www.kriesi.at/support/ Devin and Ismael, You've done it! This code will do just fine. I have updated the site and it looks pretty good! Thank you so much for your help. I really appreciate it! Great theme, Great support! Issue: RESOLVED. Best wishes, <a href="http://CommonModel.com" rel="nofollow">http://CommonModel.com</a> Devin on "Center Alignment for Icon Box?" http://www.kriesi.at/support/topic/center-alignment-for-icon-box#post-53547 Thu, 26 Apr 2012 17:11:15 +0000 Devin 53547@http://www.kriesi.at/support/ Hi commonmodel, Site looks great! You are correct in where to put it but lets take the css Ismael provided and push it a bit further :) <pre><code>.iconbox_icon { float: left; padding: 8px 5px 0 0; width: 100px; } .iconbox_icon img { margin-left: auto !important; margin-right: auto !important; }</code></pre> If it messes with icons in a way you don't like on other pages, we can have it target only specific ones if you'd like. Regards, Devin commonmodel on "Center Alignment for Icon Box?" http://www.kriesi.at/support/topic/center-alignment-for-icon-box#post-53216 Wed, 25 Apr 2012 04:38:33 +0000 commonmodel 53216@http://www.kriesi.at/support/ Hi Ismael, I plugged this into the Theme Options > Styling > Quick CSS and saved the changes, but it did not do anything. Is this what you mean by custom.css? If not, how do I access my custom.css? Do I need the Custom CSS upgrade for Wordpress? Thanks for dealing with me and my n00b self. Ismael on "Center Alignment for Icon Box?" http://www.kriesi.at/support/topic/center-alignment-for-icon-box#post-53203 Wed, 25 Apr 2012 03:53:43 +0000 Ismael 53203@http://www.kriesi.at/support/ Hello, Nice work on customizing the theme. :) You can drop this line on your custom.css <pre><code>.iconbox_icon { float: left; padding: 8px 5px 0 0; width: 100px; }</code></pre> Regards, Ismael commonmodel on "Center Alignment for Icon Box?" http://www.kriesi.at/support/topic/center-alignment-for-icon-box#post-52939 Mon, 23 Apr 2012 19:08:28 +0000 commonmodel 52939@http://www.kriesi.at/support/ Hi Devin, My apologies on the filedropper links; I am not familiar with a better file hosting site (or how to do that with my own hosting). My site is live now, so feel free to check it out! <a href="http://CommonModel.com" rel="nofollow">http://CommonModel.com</a> The two pages that I would like to use a center alignment within icon box columns are <a href="http://CommonModel.com/brand/" rel="nofollow">http://CommonModel.com/brand/</a> and <a href="http://CommonModel.com/contact/" rel="nofollow">http://CommonModel.com/contact/</a> I am new to css development, so any tips you could give regarding your suggestion to "add a css style for the individual elements" would be much appreciated. Thank you! Devin on "Center Alignment for Icon Box?" http://www.kriesi.at/support/topic/center-alignment-for-icon-box#post-52898 Mon, 23 Apr 2012 15:02:39 +0000 Devin 52898@http://www.kriesi.at/support/ Hi commonmodel, Both links just go to the filedropper home page. If you'd like you can send me login credentials so that I can see the site live at: DevinVinson (at) gmail.com. Make sure to include a link to this topic or my spam filter will put it into my junk folder. Otherwise, what you'll need to do, is add a css style for the individual elements to align them as you'd like. Even then, it may not be possible to center them perfectly, but you can fake it with margins or padding. Regards, Devin commonmodel on "Center Alignment for Icon Box?" http://www.kriesi.at/support/topic/center-alignment-for-icon-box#post-52490 Fri, 20 Apr 2012 05:31:57 +0000 commonmodel 52490@http://www.kriesi.at/support/ The website is actually in Maintenance Mode right now, so I am afraid you would not be able to see it. Here are some screenshots to describe what I would like to do: 2 Column Layout using 2 Icon Boxes (see red lines on page 2): <a href="http://www.filedropper.com/2columnusing2iconboxes" rel="nofollow">http://www.filedropper.com/2columnusing2iconboxes</a> 3 Column Layout using 3 Icon Boxes (see red lines on page 2): <a href="http://www.filedropper.com/3columnpostusing3iconboxes" rel="nofollow">http://www.filedropper.com/3columnpostusing3iconboxes</a> Thank you