Hi,

Here are the font color, background color, and border color for the left icon box. You can take out the things you dont care about, and ofcourse change the colors.

/*---background color, font color, border color of the icon---*/

.iconbox_left .avia-font-entypo-fontello {

background-color: #00F;

color: #FFC0CB;

border-color: #FFF;

border-style: solid;

border-width: 1px;

}

/*background color, font color, border color of the icon box*/

.iconbox_left .iconbox_content {

background-color: #3F0;

color: #000;

border-color: #383731;

border-style: solid;

border-width: 1px;

}

/*title font color in icon box*/

.iconbox_left .iconbox_content_title {

color: #FFF;

}

2. Please provide a url to your website in order to remove that space. An image will not help. Need to see code. If it exists on the demo please provide url kriesi.at/themes/enfold the page url where this takes palce.

3. Please watch video https://vimeo.com/64927356 on how to update. If you customized your templates, you should use http://www.winmerge.org to compare the update to your current modified theme on a line by line basis to see the differences and update the parts you want. then use ftp .

Thanks,

Nick

Hi tocal,

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:

#top .iconbox_content_title {

line-height: 24px;

}

That will increase the line height for those and should fix it on your end.

Regards,

Devin

Hi,

It is not humanly possible to memorize every customization on every page of all 25+ themes created by Kriesi. Our expertise allows us to hear your issue and based on experience to find a solution.

There is a setting when you add icon boxes to chose between the two types. On the page you showed one setting is the top box, and another setting is for the bottom box. http://www.clipular.com/c?5984183=nP5u95YY68zTnjdZQ7M-p3K48II&f=.png

”Icons” is a deceptive word for what those objects are, and I think the word ‘glyphs’ better describes them. They are actually letters in a font, so normally they use the background color of the surface they are displayed on. You can see this for yourself by selecting a glyph/icon from the url you included, and then pasting it into a text editor.There is a finite number of these glyphs, but more are created by font designers.

So your question “How do we create those icon boxes with secondary background color?”

Go to Enfold > Styling … These settings http://www.clipular.com/c?5979214=wbrivr4adQ4g86CNba80vyKmb0c&f=.png produce this look http://www.clipular.com/c?5981208=QQxKvMUsOUltUkXuW9UQEHceyWs&f=544f41686b75de40fc3a238eeae84636

So you can match the colors to see what causes what. Obviously if you leave the color completely out of the setting, the glyph will take a background color of anything below it including an image.

—

If you want the direct css to be able to change the colors, here it is ( http://www.clipular.com/c?5983163=jwLi-AjivmSQAOy2kDhl86kB-TA&f=.png ) <– css blocks explained in image

Icon Position Setting : Left (on the above link to image, it is CSS BLOCK 1)

/*---background,color,border color of the settings:left glyph---*/

#top .iconbox_icon.heading-color.avia-font-entypo-fontello {

background-color:rgb(174,255,181);

color:rgb(205,6,255);

border-color:rgb(41,11,255);

border-width:1px;

border-style: solid;

}

—

Icon Position Setting : Top (on the above link to image, it is CSS BLOCK 2)

/*---background color of the box itself (orange)---*/

/*---shadow around the box itself (raspberry)---*/

#top .iconbox_top .iconbox_content {

background:rgb(233,122,37);

box-shadow: 2px 2px 3px 2px rgb(160,49,49);

}

/*---background,color,border color of the circle and of the glyph---*/

#top .main_color.iconbox_top .iconbox_icon {

background-color:rgb(174,255,181);

color:rgb(205,6,255);

border-color:rgb(41,11,255);

border-width:1px;

border-style: solid;

}

*If you want to make every icon box on a page to have its own colors, you will need to use CSS with firebug or Chrome Developer Tools to look at the code ***after*** creating the boxes to get their individual ID numbers and add those to the above css. To learn more about CSS, a highly recomended resource is CSS Beginner Tutorial or 5 Baby Steps to Become a CSS Sorcerer

I hope this answers your question :)

Thanks,

Nick

Hi,

This produces the background color, please add it to Quick CSS or to /css/custom.css file

#top .iconbox {

background: rgba(110, 128, 128, 0.49) !important;

}

You can play around with the colors and transparency levels here to find what you like best.

Thanks,

Nick

REQUESTS ORGANIZED FROM BELOW ( A star is 1 person asking, a number is the number of people asking for feature)

Those of you who were asking for ability to use Layout Editor with Custom Post Types or Posts, please view this video tutorial which shows how to do just that -> https://vimeo.com/channels/aviathemes/64996057

*) Layout Builder Element – an element that is 100% wide, so that text media entered into it will be 100% wide from side to side.

*) Layout Builder Element – Special Heading Element – ability align right or center through a dropdown

*) Layout Builder Element – Option for Iconbox and Iconlist to chose whether you want Title , Icon and/or Entire Box to be the link

*) Layout Builder Element – Custom color for “Special Heading” element. Atm only “Default Color” and “Meta Color” are supported.

*) Layout Builder Element – Allow excerpt/pre-set number of characters to be added from a post or page via layout builder with a ”read more” link., instead of only being able to add the content of an entire page (inside a column for example)

*) Layout Builder Element – Ajax Search – Provide as a page builder element or/and as a widget to use in sidebar

*) Layout Builder Element – Lightbox-option for the image media-element would be perfect :-)

3) Post/Page Layout – integrate a javascript timeline component, such as the one from VeriteCo.

3) Post/Page Layout – Masonry Blog/Portfolio Layout – more layout options for Blog, possibly masonry/magazine type layout, etc.

*) Post/Page Layout – Ability to add Author Box to Every Post even when not multi-author blog format. (multi-author format has the page too narrow compared to single author format)

*) Post/Page Layout – wishlist functionality – some eight months before xmas ;-)

*) Post/Page Layout – easily add a button in the header (important for companies with 1 product / service http://www.getfanba.se)

*) Post/Page Layout – Ability to choose either pagination or infinite load on same page

3) Portfolio – Ajax Portfolio functionality

2) Portfolio – Masonry Layout option (free floating with different image sizes)

*) Portfolio – customize the Archive slug for portfolio items so if single slug set to “lesson”, the archives would be “lessons” (instead of portfolio-items/)?

*) Portfolio – Ability to set custom url when featured portfolio item is clicked in the portfolio grid to open a different page than the portfolio item page.

*) Portfolio – Add Portfolio grid as a widget.

*) Portfolio – Choices Theme style hover effect, where the hover overlay follows the cursor movement

2) Sidebar – Option for custom horizontal separator lines between widgets in sidebar etc. like the one as on gennis

*) Sidebar – Colored Section that works with side bar not just full width.

3) Widgets – Google Maps – ability to adjust height + more control / flexibility with aditional fields

*) Widgets – More title options for widgets

*) Widget – Social Media Widget for footer

4) Layout Builder – Add layout builder to Posts

4) Layout Builder – CPT Support – For Avia framework to recognize custom post types so that can use Pagebuilder on those pages, change sidebars at will, etc.

2) Text Editor – Option to have a link for both quick view and detail view. Some users may want the option to go directly to the detailed view.

*) Text Editor – Support for javascript in the text editor: https://kriesi.at/support/topic/script-code-in-avia-layout-builder

*) Shortcodes – for icons: https://kriesi.at/support/topic/icon-in-special-heading-section-or-icon-shortcodes

*) Shortcode – Breadcrumbs – as a short-code where it can be placed at top of the page above title. Difficult to find breadcrumbs when aligned to the far right.

*) Contact Form – additional field types to contact form (e.g. date picker, pick-list, drop-downs, etc.).

*) Contact Form – Have the contact form auto scroll to the top of the page or go to #top after submit

*) Images – Wide featured images in blog posts that are scaled to the entire available width, rather than pushed to the left of the text.

*) Images – Fullscreen background images / galleries with optional captions and/or minimal content boxes

*) Icons – Add YouTube to the social icon list

*) Icons – Option to have different hover icons and hover styles.

*) Menu – Control over main menu fonts/size/colour without using CSS

*) Menu – Ability to use Entypo icons within menu items

3) Headers – Small fixed header with social icons and menu. With the option to have just the header (logo + menu) part fixed and shrinking.

2) Sliders – Portfolio/Blog Slider Navigation Arrows only show up during hover so user may not know there is more unless they hover first. (arrows below slider)

*) Export Ability – ability to export Enfold “Styling” options. Too easy to click on one of the presets, and all of the custom changes you made are gone…

*) Newsletter – integration with newsletter (mail chimp) and integration with contact form + newsletter sign-up panels + login area.

*) Links – Ability to select if link should be opened in a new window or in same window for (example: social etc.)

*) CSS – Make sure that custom.css is the last css file in head

*) Audio Support – Like incarnation http://kriesi.at/themes/incarnation/event/sunday-prayers-2

*) Events Calendar – Like Incarnation http://kriesi.at/themes/incarnation/events

*) Bug – validation to work for additional fields (only seems to work if you use the default form fields)

*) Bug – Image alignment dropdown option to work in 1/3 column layout (doesn’t move the image at all, whichever alignment I choose; image is smaller than column width, so there is room to align)

up to Peter’s post on 4/28