I love using the Roots theme as a starting point for many of our custom themes we do for our clients. It’s responsive, lightweight, and comes with Bootstrap built in. However, it can be a bit difficult to get started for WordPress beginners (and even experienced themers alike) due to it own system of templates […]
Tag: Theming
Categories
Loading a Google Font in WordPress
function load_fonts() { wp_enqueue_style(‘googleFonts’, ‘http://fonts.googleapis.com/css?family=Montserrat:400,700’); } add_action(‘wp_enqueue_scripts’, ‘load_fonts’); The proper way to load an external font library, such as from Google Fonts, is to use the wp_enqueue_scripts hook. You can use the above sample code in your functions.php code or load it up via a custom plugin. Breaking it down Couple of key points: “wp_enqueue_script” […]
Most users are familiar with dropdown menus on websites. Move your mouse pointer over the parent and it shows the dropdown menu with the children links. The Twitter Bootstrap, in order to accommodate mobile devices, has this functionality as “on click” for the dropdown to appear, instead of mouse over. As a result, the top […]
The Underscores WordPress Theme (aka “_s”) is a great starter theme for anyone know who knows their way around markup and CSS. However, it doesn’t come with our favorite layout tool, the 960 grid system. This tutorial shows you how to add 960gs to your WordPress theme in just a few minutes. This is not […]
Dealing with form fields can be a little tricky when making a responsive theme for a website. You can code your CSS for each device or browser width, which can results in a lot of extra or redundant code, or you can use this simple technique. Set your text fields (or input/element of your choice) […]
Sometimes it’s best to add external CSS files through Drupal’s drupal_add_css() function. A very practical example is where we add a Google web font to a subtheme. If you’re customizing a subtheme of a complex theme like Omega and don’t want to have to create a new page.tpl.php file just to add a custom style sheet, […]