Loading

Style Genesis Menus with Gradients and Images

Using Dynamik's CSS builder to build and preview changes live

Mention the Genesis theme framework to the web developers I know and you will always hear good reviews. The idea behind WordPress theme frameworks is that they make theme design simple. A parent theme loaded with easy to access features provides a canvass that can be molded into different designs. Those designs are built as child themes. Genesis is feature rich and very well written. There are hundreds of child themes for Genesis. StudioPress - the team behind Genesis - has 43 plus child themes of its own and a new one is released every month. Used with Dynamik - an overlay that opens … [Read more...]

How to Embed Documents into WordPress

Embed-Docs-With-Google-Docs-Viewer

Embedding documents into websites is super easy with Google docs. No Google account needed. No API key needed. Just follow the link to the tool: https://docs.google.com/gview/ Once there, paste the URL of the file you want to embed into the Document URL field and press Generate. Copy the embed code into your page. This works for WordPress too! Upload the doc to be embedded with the WordPress Media Uploader (Media > Add New) Edit the uploaded media so you can grab its URL Visit https://docs.google.com/gview/ Paste the media's ULR into the the Document URL field Press … [Read more...]

Super Easy WordPress Theme Design with Dynamik for Genesis

Dynamik for Genesis

Q: What do you get when you cross a lazy web designer with Google search? A: A Genesis child theme overflowing with options for near drag'n'drop visual theme styling. I'm guessing you're lazy too or you wouldn't have made the same search I did. I build a lot of Genesis child themes. Some I design around existing child themes and others I build around the default Genesis theme. Many of the features and changes I make to child themes are the same: Setting the body background color Setting a body background image Changing menu colors Making the page narrower or … [Read more...]

How to Center the Genesis Theme Logo Image

The Genesis theme usually places the header image to the left side of the page. You can center it with a quick snippet of CSS. Center your theme logo header image by putting this CSS in your child theme's style.css file: /** Center the header image */ #header { background-position: top center; } If you want to place the CSS in the Genesis settings panel go to Genesis > Theme Settings and add the CSS in the box below where the text Enter scripts or code you would like output to wp_head(): You would add the CSS like so: <style type="text/css"> /** Center the header image … [Read more...]

How to Overhang a WordPress Header Image in Genesis

Overhanging Header Logo Image

Every once in awhile I'm asked to make the header logo image in a WordPress site jut out of the header area so it overlaps whatever is below it. You might think it's impossible. It's not. Look at the image to the right for proof. To make the header image hang over and stick out of the header area we need to remove the Genesis header action and replace it with a custom header action. The trick is to remove the default header function and replace it with a new one that adds a second widget area to the header. Using a widget area lets us place a logo image in a text widget then use CSS to … [Read more...]

How to use external fonts in web pages

Ever wanted to know how to add fonts to a webpage using Google fonts or a downloaded font file? Or ever need to convert fonts to different formats to improve cross browser support? There are simple solutions to both. Questions this guide answers How do I convert fonts into different formats? How do I add new fonts to my web pages and websites? What code do I need to use to make a web browser use a font installed in my website? How do I install a non standard font into my website? Where can I get free fonts? Where can I convert ttf files to other formats. How to add Google … [Read more...]

All original content on these pages is fingerprinted and certified by Digiprove