Get Contents from Visual Composer Page and Load into Another with CSS Styling

<?php $id = 200; //page id $shortcodes_custom_css = get_post_meta( $id, ‘_wpb_shortcodes_custom_css’, true ); if ( ! empty( $shortcodes_custom_css ) ) { echo ‘<style type=”text/css” data-type=”vc_shortcodes-custom-css-‘.$id.’”>’; echo $shortcodes_custom_css; echo ‘</style>’; } $post = get_post($id); echo apply_filters(‘the_content’, $post->post_content); ?>

Stop Product Image from Opening in New Window

You’ve got your woocommerce site up and running but there’s this really annoying thing happening when users click on the product image. The image opens in the same window, navigating away from the product page. Here’s a quick fix using jquery. If you’re not familiar with child themes, download the Custom CSS/JS plugin and drop this into a javascript file! jQuery(document).ready(function( $ ){ if ( $(“.woocommerce-product-gallery__image”).length ) {    //make sure

Send E-mail with Attachment using PHP

Here’s a perfectly working snippet of PHP code which will send an e-mail with an attachment (of any file type). This code has been updated to disable jumbled/garbage/corruption which showed up on gmail (while it was fine on Outlook). //File settings $fileatt = “../uploads/myLovelyFile.pdf; $fileatttype = “application/octet-stream”; //Octet-stream is a file type to allow all types of files $fileattname = “myLovelyFile”; //Read file contents $file = fopen($fileatt, ‘rb’); $data =

Add Checkmarks to your Unordered List Items

You have a regular unordered which shows with bullet points just like this: HTML: <ul> <li>Apples</li> <li>Oranges</li> <li>Grapes</li> </ul> Result: Apples Oranges Grapes The bullet points are ugly and the check marks would be so much more relevant. Here’s how to turn the bullet points into checks. First, add a class like checkmark to the ul tag which will indicate when the checks should be applied. HTML: <ul class=’checkmark’> <li>Apples</li>

Add a new widget area to a WordPress theme

If you are familiar with WordPress themes then you know that a lot of themes have a widgetized sidebar. This means that you can add, remove, and re-order widgets on your WordPress website by using the “widget” section of your WordPress dashboard. Having a widgetized sidebar is very useful, but you may want to widgetize other parts of your WordPress theme as well. This is very easy to do, and

Default Value for Submitting Forms using “Get”

I have this form I’m working on for a client which transmits data to another site for scheduling and processing. The form needs to use the “get” method where all of the values are assigned as part of the url. The sending URL looks like this: ZIP = 12345 PRODUCT = 2 QUANTITY = 4 The issue is that one value (zip code) when left empty, like this:

Customize any Form on WordPress using CSS

Have you installed a contact form plugin for WordPress and found the default layout is entirely boring? I’ve been there! The default layout comes with a very little or absolutely no css formatting. Below is the default layout for Ninja Forms. Luckily, I was able to write a snippet of code which will resolve that. The Solution to Customizing any Form on WordPress using CSS This snippet can work on

PHP Mail Special Characters in Subject Field

Let’s say you’d like to insert special characters in the subject of HTML e-mails sent with the PHP mail() function. You have an email subject which when extracted from my database looks like this.. Coffee &amp; Laptop Sample code.. $to = ‘’; $subject = ‘Coffee &amp; Laptop’; $message = ‘HTML message…’; $headers = ‘MIME-Version: 1.0’ . “\r\n”; $headers .= ‘Content-type: text/html; charset=utf-8’ . “\r\n”; $headers .= ‘From: Me <>’ .

CSS Media Queries for Mobile Devices

Writing CSS for different devices can be a pain in the ass. With Media Queries it’s easier, if you know how to pin point a specific device. This can help you pin point a specific mobile device from within your CSS. Copy the code and paste it into you CSS file and get crackin’! /* Smartphones (portrait and landscape) ———– */ @media only screen and (min-device-width : 320px) and (max-device-width