background preloader

Tutorial

Facebook Twitter

Google

Windows. Wordpress: Content Output in 2 Columns. Recently I had to create a website which displays the content in 2 columns.

Wordpress: Content Output in 2 Columns

While CSS 3 is capable of doing this on its own with the new Grid Position Module, a lot of browsers do not support this functions yet, so I needed to add a little extra markup to the output which is generated via the_content() to get the following result: To get this result we need to filter the_content() before output with a custom function and add 2 divs to the output, which we style with CSS later on.

So Ladys and Gentleman please open the functions.php file of your current WordPress Theme. What functions.php does is let you create functions you can reuse in your theme. It works similar to a plugin file, being loaded when the theme is first loaded. Basic Vue 5 Infinite Ecosystem Tutorial. A Simple Vue EcoSystem We're going to work together to create a simple scene in Vue 5 Infinite, using our own Ecosystem, so let's begin!!

Basic Vue 5 Infinite Ecosystem Tutorial

I've kept the items added to the ecosystem very basic, for those who might be using the Demo version. First off, with Vue open, add a Standard Terrain to our workplace. (Click on smaller image to view full size picture) Double click on the terrain in the workplace and the Terrain Editor will open up: Touration.com. 6 Ways to Display WordPress Post Content in Multiple Columns.

Most blogs display their content in single columns, but it’s also possible to display content in . Multiple-column layouts are perfect for newspaper and magazine-style themes. Here are six ways of getting the job done. WordPress Theme Hacks. WordPress was originally created as a weblog or blog platform.

WordPress Theme Hacks

But now WordPress has grown so powerful that you can use it to create any type of website and use it as a Content Management System (CMS). In this article, I'm going to share some of my WordPress tricks with you on how to make a better WordPress theme. I'm not a programmer nor developer, so I will focus more on the frontend development. Oh yeah, I forgot to mention that WordPress has made it so easy that even a non-programmer (designer like me) can build a wonderful website.

My WordPress sites included: N.Design Studio, Best Web Gallery, Web Designer Wall, and some free WordPress Themes. Static frontpage - combined with dynamic content - in WordPress Tutorials @ MoshuBlog. Thanks for visiting!

Static frontpage - combined with dynamic content - in WordPress Tutorials @ MoshuBlog

If you're new here, you may want to subscribe to my RSS feed. My blog posts useful tips, ideas, tutorials and guides for WordPress bloggers - and articles about the life on the Canadian Prairies. If you are familiar with RSS readers, just add my feeds to your reader! You can also receive updates by email if you submit your email address in the box on the far right sidebar. Also, if you are here searching for WP Tutorials, please download the Best 7 WP Tutorials in this ebook.

[I know I still owe the second part of my Two-level menus article regarding the styling of the menus but today this little trick came up and I thought I'd share it.] Since WP 2.2.x in the Options > Reading there is the possibility to assign an existent(!) Make Your Theme WordPress 3.0 Compatible. WordPress 3.0 is just around the corner.

Make Your Theme WordPress 3.0 Compatible

This time its going to be big, some cool features are in the box. Time to patch up your WordPress theme. Here is all you need. What’s new in WordPress 3.0? See all the new features if WordPress 3.0 here or if you are in a hurry, here is a list of 8 cool features that’s gonna affect most of us. I tried out the Beta1 release, its impressive! So you want to create WordPress themes huh? Changing Headers with WordPress body_class(): quirm.net. WordPress 2.8 introduced a new function — body_class() — that attaches a list of classes to the <body> element according to what type of page is being displayed.

Changing Headers with WordPress body_class(): quirm.net

These classes can be used — in conjunction with your theme’s stylesheet — to display different headers on different page types. Let’s assume your header markup looks something like: <body <? Php body_class(); ? >><div id="header"><div id="headerimg"><h1><a href="<? And your current CSS for the header looks like: Custom WordPress Homepage with Customizable Widgets. Adding Custom Google Maps to Your Website. Maps are often placed on a company website to help customers find their way there.

Adding Custom Google Maps to Your Website

For that, Google Maps is excellent. But wouldn’t it be nice to add your company logo, parking lots, train stations, etc. to the map, to help the customer even more? Extend WordPress With Custom Fields - Smashing Magazine. Advertisement WordPress’ popularity has grown exponentially as of late.

Extend WordPress With Custom Fields - Smashing Magazine

This rise in popularity is due in part to WordPress’ custom fields. Custom fields allow you to add little bits of data to posts. They have changed the way people look at WordPress. PHP 101: A Simple Seat Reservation System. How to turn any jQuery plugin into a Wordpress one. Part 1: Anatomy of a jQuery Plugin In this part, we'll analyse what a jQuery plugin is usually made of, where each of those elements should be placed, and how do we usually work with them.

How to turn any jQuery plugin into a Wordpress one

Throughout this article, we'll take for example the jQuery FancyBox plugin, (even if there is an existing WordPress adaptation for it already, it's just to have a concrete example). A) The Javascript Source jQuery is a javascript library, and plugins are there to help us extend the capabilities of it, so they are written following the same jQuery syntax. Every plugin you'll download is written within a javascript file. //Include the plugin script<script type="text/javascript" src="Path_to/jquery.fancybox.js"></script> B) The Javascript Snippet Once you have included the plugin script within your application, most of the time you'll be asked to write a little snippet of code that will make your site or application use the plugin when required.

Custom order of posts on main page » WordPress Experiments. The most common home page on WP powered site contains posts listed in chronological order (from the newest to the oldest one).

Custom order of posts on main page » WordPress Experiments

But sometimes we need different layout. Fortunately WP is quite flexible and allows to create many customized lists of posts. I’m not going to list all of them since I guess such list would never end up. But I will show some of the most popular customizations including required changes.All changes will be applied to index.php file (the one within folder with theme we use) since that’s the one responsible for main page look. I have already written about two custom main pages: displaying one post plus list of titles of other posts – Main Page – one post plus list of titles of other postsexcluding one particular category from main page – (first paragraph) But they use different functions. The most common usage (in my practice):1. <? Posts listed in reverse chronological order (from the oldest to the newest one)<? Create A Peel Away Effect On Your Blog / Website.

How to edit Wordpress themes using Dreamweaver. It has been more than a year since I used Dreamweaver to design a site. I’ve mostly been running sites using PHP-MySQL content management systems (CMS) and depend on the thousands of ready-made themes and templates to control the site design. For the occasional static page, I use Nvu for visual editing. Creating a WordPress Theme HTML Structure. Update: We’ve created a second edition of this article, with updated code samples and coverage of the latest theme development techniques. Check it out at Creating a WordPress Theme HTML Structure. It’s part of The ThemeShaper WordPress Theme Tutorial: 2nd Edition. Now we’re starting to get into the real meat of WordPress Theme development: coding the HTML structure. The Goals of Any HTML Structure.