Up and running with installing Sass on macOS Sierra or OSX 10.11 Sass (Syntactically Awesome Stylesheets) is a CSS pre-processor tool in which you write your CSS code using variables, selector inheritance, mixins, and nestings and and then compile that code to spit out regular CSS. The benefits of SASS are more advantageous in a …
Read More
Swap Header Right and Title/Logo Area in Genesis Sample Theme
How to swap Header Right and the Title/Logo Area mark up structure in Genesis Sample Theme. Genesis themes most of the time come with a header site title & description area on the left and widget area on the right, this is suitable a lot of the times but on occasion you may need this …
Read More
Add a Custom Header Image in Genesis Sample Theme
The Genesis Sample theme does not have a custom Header option in the Appearance sub-menu in WordPress Dashboard unlike all the other Genesis themes. Custom Headers are a native WordPress function that can be added to any theme including the Sample theme. This option can be easily added via a code snippet into your functions.php file. //* …
Read More
Using ScrollNav to control long documents in WordPress
Controlling long document display on a web page can be greatly enhanced with a Javascript solution like ScrollNav which collates all of a defined HTML element in a document like a heading tag such as a h2, puts all of the elements set up in a navigation markup done for you and keeps the links to the relevant …
Read More
Optimise and streamline your CSS style code with CSScomb
You can really optimize and streamline your CSS code with a great application called CSScomb. It can also help identify errors, similar to the excellent CSS Lint which does error checking and style/selector suggestion. However where CSScomb comes into its own is the presentational and efficiency aspect of CSS style coding. CSScomb features include sorting your CSS …
Read More
How to check for CSS errors in your stylesheet with CSSlint
You’ve worked long and hard and slaved over your masterpiece but the CSS styles you wrote are just not being applied to your HTML, how can you check that the CSS syntax and formatting is correct? CSS Lint can do this for you. Got to the site and paste in your CSS. You can refine …
Read More
Using Navgoco as a Vertical Multi-Level Menu in a WordPress Genesis Theme
Looking for a expandable/contractable Vertical Multi-Level Slide Menu in regular WordPress or Genesis themes, Navgoco has you covered. Create Your Menu Set up your custom menu as normal in WordPress Dashboard with multi levels and place into position via a widget area or simply use HTML mark up on a post or page, this example uses a …
Read More
Add a Submit Button to the Search Input Field in Genesis Search Widget
By default the Search widget in a Genesis WordPress theme does not have a submit button, just hitting enter on the keyboard will do the trick but what if you deadset want that clickable submit button back. Using the Genesis Sample Theme, this is how the search widget looks like when added in the Header Right and …
Read More