Blog

Adding Custom Fieldsets to Gravity Forms

Fieldsets are important in ADA compliance because they help tell screen readers that a group of fields belong together and can share a label. This enhancement makes it easier for those using screen readers to use your site and navigate your forms, and you certainly don’t want to give anyone any obstacles in using your site! Now, what if you’re using Gravity Forms to create your forms?  Gravity Forms allows you to add certain grouped fields that will automatically add a fieldset around them. These are fields like Address, Name, and other combined information. This can be helpful, but it also can be very restrictive. You must choose fields that are certain field types and only have a maximum amount. It is true that you can modify the title of a “name” field – such as “middle name” – to identify it as accepting an email address, but you’ll lose

There's More »

WordPress Hooks – The Difference Between Actions and Filters

WordPress handles most of what’s needed to output your content to the user’s screen with PHP and SQL, producing that information in HTML with the capability to manipulate it further with JavaScript. However, there may be times when you want to modify how WordPress works with that data on the back end or how it’s displayed to the user. There are a few reasons for this, including ensuring ADA compatibility, modifying content before it’s saved, or simply deferring enqueued JavaScript files. In circumstances where you need to alter the data, either to change it before output or to add an additional function while something is loading, WordPress offers hooks in two flavors: Actions and FIlters.  So, what is a WordPress hook? It is an additional function that you can use in order to interrupt WordPress’s normal operations and run some of your own. This can be very handy because WordPress

There's More »

Enqueueing JavaScript and CSS Files In Your WordPress Theme

When you’re building a theme, it is important to be able to use CSS stylesheets or JavaScript files where necessary. Sometimes you only want a script or stylesheet included on a specific custom post type or template, you might be adding some fancy JavaScript to modify your site, or you may just want to add different stylesheets for different media values. WordPress is not picky about allowing you to add additional files and it is well within your capabilities when written properly. In order to add files correctly, you’ll have to use the enqueue functions available within WordPress. Enqueuing the files this way ensures both full control and the ability to filter the HTML if needed. It is important to note that these files will only appear in your theme when you use wp_header() and wp_footer() within the head of your theme and just before the ending element for the

There's More »

Using Chrome Developer Tools to Modify CSS

or: How I Learned to Love the !important Every site that you visit uses CSS. If it didn’t, it would look like plain black words on a flat white background with text left aligned to the side of your browser and no gutter, padding, or color to speak of. Even in an attempt to emulate a plain paper book, CSS should still be present in order to properly display the words you’re presenting. When you first look at CSS, it can seem exceedingly simple and easy to control, requiring nothing but an identifier and a key and value pair in order to specify which item should look which way. This deceivingly simple appearance can end up frustrating many front end designers trying to modify a site’s facade. CSS stands for Cascading StyleSheet. This acronym hints at one of the frustrations that I’ve found new designers have. To get into it,

There's More »

Building a WordPress Theme

Building a WordPress Theme Part 1 – Setting up the stylesheet and the file structure There are many articles out there on building a WordPress theme, and many different techniques for doing so. I would like to tell you what I’ve learned, the best practices I’ve found, and the easiest path for creating a WordPress theme. If you want to include additional functionality, I suggest you use a plugin. If you’re just looking to style your website, then a template is what you’re after. The first step is to ensure that you have the latest version of WordPress installed on your server. Starting Out: Okay, WordPress is installed. Now what? Start by creating a directory in the wp-content/themes/ folder with an obvious and appropriate title. All of the theme’s work will go into this folder, such as your images, JavaScript, additional CSS, etc. The Stylesheet A theme’s default stylesheet is

There's More »

New HTML5 Capabilities

Let’s take a look at some new HTML5 capabilities HTML5 has caused many ripples in the technology community over the past few years. There are a lot of different aspects of this that are still hazy, and a lot that change every day. That’s one of the exciting things about the technology field, there’s always something more to learn and there’s always information that changes. In this article, we’re going to take a beginner’s look into the new HTML5 elements and what they’re used for. In addition, we’re going to inspect one of our old favorites, the <input> element. Some additional attributes and types are now available to use with this that you could have a lot of fun with. New HTML5 Elements One of the most exciting parts of HTML5 is the semantic elements that will be used. These elements are meant to contain what their title implies, always.

There's More »

Starting Out With the Flexible Box Model

Flexible Box Model, or Flexbox, is a CSS3 technique for styling web pages. This layout mode provides a simple and easy way to create your theme without messing with floats or attempting to style your boxes to be the same height. The Flexible Box Model will help you unify your layout, and even provide you with solutions that do not require addition, subtraction or determining the percentage of width for a certain object. This technique could be extremely beneficial if you’re attempting to design a responsive website. We’ll start with one simple <section> that will be the container for our flexible boxes: 123<section id="parentbox"> </section> I’ve written this article for Cequix Technology Solutions. You may read the rest of this article on the Cequix blog

There's More »

Multiple Background Images with CSS3

Utilizing multiple background images with CSS3 It has been a long-time dream of many web developers to have multiple images as a background for one div. There are numerous benefits to this, but one of my favorites is the repeating gradient with an image layered on top. Yes, you can achieve this by creating a whole bunch of extra <div>s and ensuring that the styling is correct in so many different places. Then, all you have to do is keep hoping against hope that one floating <div> or an absolute placement doesn’t mess everything out of whack. To get the job done a lot quicker and easier, simply use comma separated arguments: 12345.complicated_bg{   background-image: url("../image/one_img.jpg"), url("../image/bg_gradient.jpg");   background-position:  center top, left top;   background-repeat: no-repeat, repeat-x; } Notice that the image you want layered on top is positioned first in this. In order to place multiple images over one

There's More »