'''Update on July 11, 2012''': Builder provides IE browser specific IDs for the html element. These are ie7, ie8 and ie9. It is thus possible to write IE 7, IE 8 and IE 9 specific CSS. [http://ithemes.com/forum/topic/30017-comment-form-text-area-weird-format-in-ie/page__view__findpost__p__139158 This] forum topic provides an example where post comment text area (which already has <code>border-radius</code> set in style.css) can be made to show rounded corners in IE 8 using CSS3 PIE. The alternate method listed below also works.

'''1.''' Download the latest version of CSS3 PIE from [http://css3pie.com/download-latest here].

'''1.''' Download the latest version of CSS3 PIE from [http://css3pie.com/download-latest here].

Revision as of 03:02, July 11, 2012

This is Page 2 of Plugin related and other generic customizations in Builder. Here is Page 1.

Note: If a layout is applied to this Page, ensure that it (the layout) does not have an extension applied.

How to use CSS3 PIE

PIE stands for Progressive Internet Explorer. It is an IE attached behavior which, when applied to an element, allows IE to recognize and display a number of CSS3 properties.

It is used to get CSS3 properties like border-radius working in IE older than version 9.

Follow the steps below to make CSS3 PIE work in Builder:

Update on July 11, 2012: Builder provides IE browser specific IDs for the html element. These are ie7, ie8 and ie9. It is thus possible to write IE 7, IE 8 and IE 9 specific CSS. This forum topic provides an example where post comment text area (which already has border-radius set in style.css) can be made to show rounded corners in IE 8 using CSS3 PIE. The alternate method listed below also works.

2. Extract the zip flle and upload PIE.htc to any web reachable directory.

Ex.:

public_html/assets/PIE.htc

3. Add position: relative; style to all those selectors for which you would like to use CSS3 PIE. You will of course be specifying border-radius/box-shadow etc. properties (which are supported by CSS3 PIE).

4. Check child theme directory using a FTP client or cPanel file manager. If single-<cpt>.php has not been automatically created, copy/upload single.php from parent Builder into the child theme and rename it as single-<cpt>.php.

How to implement Yoast Breadcrumbs in Builder

1. Determine where you want the breadcrumbs to appear and edit the appropriate template file(s) in child theme. Use this image as a reference. If a particular file is not present in the child theme directory, copy it from parent Builder directory.

Generally speaking, these are the files that you will be modifying: page.php (for static Pages), single.php (for single post pages), index.php (for Posts page) and archive.php (for category pages).

2. Let's consider Kepler child theme as an example and that we want to add breadcrumbs to all Pages.