Customizr Theme Documentation


This documentation aims to give beginners and advanced users an overview of what is possible with the Customizr WordPress theme. Before diving into it, you might want to check those useful pages.

 

Theme overview

Fully responsive

customizr-responsive-wordpress-theme

The Customizr theme is built on a fluid flexible grid that automatically adapts to fit any screen devices : computers, laptops, tablets or smartphones.

Customizr features

 

Cross browser

The Customizr theme has been successfully tested with the major browsers.

Chrome Firefox ie Opera Safari

Languages

The theme is currently available in the following languages :

      • Arabic (ar)
      • Brazilian Portugues (pt_BR)
      • Chinese simplified (zh_CN)
      • English (default)
      • French (fr_FR)
      • German (de_DE)
      • Italian (it_IT)
      • Polish (pl_PL)
      • Romanian (ro_RO)
      • Russian (ru_RU)
      • Spanish (es_ES)
      • Swedish (sv_SE)

Get started with Customizr

Installation

The easiest way to install Customizr is :

  1. Go to your WordPress dashboard
  2. Select Appearance > themes
  3. Click Add new
  4. Search for Customizr in the Search box
  5. Hover on the theme and click install.

If you need to download the whole zip file (e.g. to install locally), you’ll find the latest zip file on this page by clicking the number of the version, not the “svn” link.

Installing the theme will add a new folder in your existing WP folders/files. Customizr can be found at: wp-content/themes/customizr.

Having done a clean install, it is worth taking a backup of the customizr folders in case you mess up and want to get back. You can then simply copy the backup folders & overwrite the damaged folders, ensuring that you don’t leave any potentially corrupted files lying around.

Activation

Login as an Admin User via /wp-admin.
Go to your Dashboard>Appearance>Themes and it will show all the Themes that have been loaded in the WordPress installation, and by yourself since. Typically, you will see twentytwelve and twentythirteen at least. Click on the Customizr Activate link and you are ready to use Customizr.

Starting up

It now depends on your User level where you go to next. Anyone can do the following to get an understanding of the Theme.
1 Watch the Customizr Introduction video
2 Watch the Creating A Slider video

3 Go in Appearance > customize to see the Preview Panel. This is where you will setup the main design option of your website : color skin, logo & favicon, site title & tagline, front Page, navigation, Pages & Posts Layout, Comments, Social links, Images, Custom CSS.

To get an ‘out-of-the-box’ system working, fill in the panels to meet what you need.

Regenerate your images Important

The theme uses three additional image sizes that are automatically created when you upload them into WordPress. If you already have images in your media library, it is a good practice to regenerate your pictures to ensure they will look nice in the Customizr theme , especially for the slider, featured pages and post thumbnail. The best way to do that is to use a great and safe plugin called Regenerate Thumbnails, that you can download from the plugins admin screen or here.

WordPress version requirements

Customizr requires at least WordPress version 3.4+ to work properly (especially the WordPress live customizer feature).

 

Videos Tutorials perfect for newbies!

Here are two video tutorials created by WordPress professionnals and based on the Customizr Theme . They teach you how to create a real profesionnal website from scratch. I highly recommend those if you want to follow a “step by step” approach.

 

Create a child theme for developers

The best and safest way to develop and customize a website with Customizr is to work with a child theme. Everything you need to know on how to create a child theme of Customizr here.

 

 

Customize your website live!

This theme uses the WordPress customizer feature for most options : see your design and layout changes live!

Check out this video.

 

Choosing a skin

choosing-a-skin-customizr

The theme comes whith 17 predefined color skins that can be selected from the customizer panel :

      • Blue (default)
      • Green
      • Yellow
      • Orange
      • Red
      • Purple
      • Grey
      • Black

The main skin color is used for many elements of your site : links, buttons, tagline, icons, …

Uploading a logo and a favicon

customizr-logo-favicon

Logo

Your logo will be displayed on the top left corner of all your pages.

Go to the customizer screen in the logo and favicon section and upload your logo file.

Supported logo file formats : jpg, png, gif

Recommended logo dimensions => max-height :100px, max-width : 250px For best results, try uploading a logo with those maximum dimensions. If your logo is larger, you can check the “force logo dimensions” option to make it fit better to the theme.

If there is no logo uploaded, Customizr will use your website title as logo.

Favicon

The favicon is the small image showing up in the browser’s address bar and tabs. It’s a cool way to give your website an additional identity marker.

Supported favicon file format : ico, png, gif

Go to the customizer screen in the logo and favicon section and upload your favicon file.

Note : when migrating from one server to another (like from development to production for example), you’ll have to re-upload your logo and favicon.

Website’s title and tagline

Customizr-logo-tagline

If you did not choose any logo, the title appears on the top left corner.

The tagline is displayed on the top right corner of all your pages. If you don’t want to have a tagline, just delete it and save.

Note : from a search engine optimization perspective (SEO), those title and tagline are important because they will be one of the most recurrent words throughout your website and they also will be used in your page titles (the name in the tabs of your browser) by many SEO plugins.

customizr-tagline-title

Designing your front page with Customizr

Your front page will be the most visited page of your website and also the one with the highest ranking in the search engine results page (SERP).

Two other important facts to have a mind :

1 80% of your visitors will only visit your website once and never come back

2 an average 50% will only see one page (usually the home page) and “bounce” : in other words, leave your website.

With that says, what can you do to create an attractive front page that will really have an impact for the users experience and make them stay on your website?

Well, they are actually some simple and efficient principles to apply if you want to design a successful front page :

1 Know your visitors :

      • Who are they (age, genre, country, job…) ?
      • What are they looking for ?
      • What can you offer that is really special (that they won’t find anywhere else)?
      • What you like to see in a website like yours?

2 Give an overview of what your website is about in 3 main points. Example of informations :

      • Who we are?
      • What we do?
      • What our clients say about us?
      • How to contact us?
      • What are our last news?
      • Where can you find us?

3 Engage your visitors

For that, a very good approach is to use pictures and call to actions buttons. As they are generating emotions, images have a greater impact than words on your visitors. When you combine images with call to action buttons, you increase your chance to engage your visitors to go further in your website.

Customizr has been built with these principles in mind and the fact that it can be enjoyable to build a website! The theme makes it really easy to include pictures (in the slider and featured pages), text and call to actions. This will be a great help for a better engagement of your visitors.

Choose a content and a layout

Customizr-choose-front-page-content-layout

1 Select what the type of content you want to display on your front page :

      • a static page : this will activate a dropdown list of your website pages. Select one in the liste. It will be displayed  below the slider and the featured pages if enabled. Note : on front page the page title is hidden.
      • your lasts posts : this will display your posts ordered by descending date. Your featured posts will be displayed first. Note : The number of posts per page can be changed in the page and post layout section.
      • don’t show pages or posts on front page : with this option, you can choose to display only the slider and/or the featured pages on your front page.

2 Choose a layout for your front page :

Choose the front page slider options

Customizr-choose-front-page-slider-options

1 Select a slider among the ones you have created (see below for slider creation in Customizr)

2 choose the slider options : full-width or boxed (more informations about the slider layout), delay between slides. Note : To remove the demo slider : select “No slider” in the dropdown list.

 

Featured pages selection and settings

customizr-featured-pages-options

1 Enable/Disable the featured pages from front page. Featured pages are enabled by default.

2 Check/uncheck the images option for featured pages. The image displayed for a featured page is the one set as “featured image” for your page. Note: If you did not set any featured image, the theme will select the first image included or associated with the page. If there are no images at all associated to the page, then a holder picture will be displayed.

3 Edit the button text. Hint : If you don’t want to display any button, then delete the default text.

4 Select the pages for each featured pages block

5 Edit the text displayed below the image. By default, this is the page excerpt.

Customizr-navigation-menu

Customizr comes out of the box with one menu location in the website header.

1 First create a menu in appearance > menus (click on Manage menus to go there)

2 Select a menu in the dropdown list of the customizer navigation section (see picture above).

Pages and posts layout

Customizr offers four differents column layouts out of the box :

1 One column full width. See full width layout demo.
2 Two columns with sidebar on the left. See left sidebar layout demo.
3 Two columns with sidebar on the right. See right sidebar layout demo.
4 Three columns with two sidebars. See three columns layout demo.

You can define your page and post layout at two levels : in the main options screen and for each single post or page.

Setting the global layout options

customizr-pages-posts-layout

In the main option screen you can define the global default layout for the different screens of your website.

Global default layout. This layout will apply for the following pages :

      • Archives : categories, tags, author page, archive by dates (day, month, years)
      • Search pages
      • Error 404 page

Hint : if you check the Force default layout everywhere, the global default layout will be applied on all your website, including front page and will also overrides the specific layout set for pages and posts (see below).

Posts default layout. This layout will be the default layout for all your single posts. This can be overriden by a specific layout set for a post  (see below).

Note : The maximum number of posts per page selected below the post layout will be applied to all posts list : home page, blog page, archives (categories, tags, authors, dates), search page.

Pages default layout. This layout will be the default layout for all your pages. This can be overriden by a specific layout set for a page  (see below).

Setting a single post or page layout

customizr-single-post-layout-settings

In the edit screen of each post or page you can define a particular layout in a dedicated box (on the top right corner of the screen). This will override the default layout set in Customizr options but can be overriden if you check the force default layout everywhere option.

Comments

Threaded comments

In the WordPress admin Settings > Discussion you can enable the threaded (nested) comments option and define a maximum deep for dicussions. If you run a blog you probably know that this is a very good way to visually organize the comments for your posts.

customizr-threaded-comments-wordpress

 

Customizr handles this feature nicely, see the screenshot picture below.

customizr-wordpress-threaded-

 

Enable/Disable page comments

In WordPress, there is no quick option to disable comments only for pages. Customizr includes an option to do that in Customizr > comments section.

customizr-comments

 

Social profiles links

As of today, you can set up to ten social network profiles in the customizer option screen.

      • Twitter
      • Facebook
      • Google+
      • Instagram
      • WordPress
      • Youtube
      • Pinterest
      • Github
      • Dribble
      • LinkedIn

The social icons can be displayed in four predefined locations of your website : header, footer, top of right sidebar, top of left sidebar.

customizr-social-links

1 Select where you want to display your social links

      • Header
      • Left sidebar
      • Right sidebar
      • Footer

2 Define your social profile links in each fields. For example : https://twitter.com/myprofilename.

Customizr image settings

customizr-images-settings

Custom CSS

See the “Going further with Customization” section

Slider Management

The Customizr theme includes a very handy ajax powered slider generator making slider creation easy as breeze. You can create an unlimited numbers of sliders with unlimited slides choosen from your media library.

Sliders are an efficient way to engage your visitors on your website, therefore the Customizr slider can also display call to actions buttons with link to any page or post of your site.

 

For a quick introduction on sliders in Customizr, check out this video : creating sliders with Customizr

Creation

1  From the Media Library, click on an image that you want to add to your slider
2  Click on the “Edit more details” link on the right of the screen (not the Edit button)
3 Scroll down and find the Slider Options box

customizr-adding-image-to-slider-option-box-closed
4  Check “Add to a slider”
5  Set the optional call to action fields : title, description, text of the button, color and link to page/post

customizr-adding-image-to-slider-options1

6 Select a slider in the dropdown list or write a name and click on the “Add a slider” button : this will automatically add the current media to your slider (no need to refresh)

customizr-adding-image-to-slider-options2

Adding images to an existing slider

1 Go to the edit screen of any image
2 Find the Slider options box
3 Check “Add to a slider”
4 Set the optional call to action fields : title, description, text of the button and link to page/post
5 Select a slider in the list

Reordering the slides (drag and drop)

customizr-slider-reordering-slides

The slides can be manually reordered with a drag and drop feature. Just put your mouse over any slides and once you see this icon : cursor_drag_arrow, just left click on the slide and drag it anywhere in your slider.

This will be automatically saved, no need to refresh.

Adding a slider to any post/page

1 Go to the edit screen of any page/post
2 Find the slider options box

customizr-slider-option-box-closed

3 Check “Add a slider to this post/page”
4 Select a slider

customizr-slider-selecting-a-slider
5 Change the delay and layout field if needed
6 Update the page

Changing the delay between each slides

Below this label : “Delay between each slides in milliseconds (default : 5000 ms)“, set your custom delay in the field. For example, if you want to have a 3 seconds delay between each slides, set this value to 3000.

Setting the layout of the slider : full width or boxed

Below this label : “Slider Layout : set the slider in full width”, click on the iphone like button to set your slider layout to full width or boxed.

By default, the layout is set to “full width”, wich means that the slider will occupy the full width of the browser screen. If you choose the boxed layout, the slider will have a maximum width of 1170 pixels.

Deleting a slider

customizr-slider-deleting-slider

In the Slider options box, at the top of the slides table, click on “Delete this slider”.

This action will delete the slider but of course will not delete the images from your media library.

 

Image sizes

Customizr includes three specific image sizes for the slider and the thumbnails.

WidthHeightCroppedUsed for

tc_thumb_size

270 pixels250  pixelsyes
  • Thumbnails
  • Featured pages

slider_full_size

9999999 (meaning infinite)500 pixelsyes 
  • Slider full width

slider_size

1170  pixels500 pixelsyes 
  • Slider “boxed”

If you’ve just switched to Customizr from a previous theme, you need to recreate your already uploaded images for them to nicely fit Customizr specific sizes. Otherwise, the circle hover effect or the slides might not be displayed properly.

Hopefully, you don’t have to re-upload all your images! There is a fantastic plugin to do that : Regenerate Thumbnail.

Very usefull and easy to use, it will not erase your previous images, and automatically generates new images at the theme sizes in your /upload folder.

 

 

Image Galleries

customizr-image-galleries

The Customizr theme uses the native WordPress Gallery that you can include in your pages and posts. A cool slow motion zoom effect is activated (with modern browsers only) when hovering the picture thumbnails.

Infos : More information about the WordPress Gallery.

Demo : See the live demo of the Customizr Gallery.

 

 

Post Formats and Navigation

Posts formats

customizr-post-format-list

On the left sidebar of the edit post screen, you will find the post format box (see the screenshot above). Just select a format the post format you want. In Customizr, you can choose up to 10 post formats for your posts. Each post format is dispalyed with a particular style and icon.

Post formats are very useful to visually distinguish the type of content and they add a nice webdesign and color touch to your website.

Demo : see all Customizr post formats in action

Standard

customizr-post-format-standard

 

Aside

customizr-post-format-aside

 

Gallery

customizr-post-format-gallery

 

Link

customizr-post-format-link

 

Image

customizr-post-format-image

 

Quote

customizr-post-format-quote

 

Status

customizr-post-format-status

 

Video

customizr-post-format-video

 

Audio

customizr-post-format-audio

 

Chat

customizr-post-format-chat

 

 

Post navigation

Single post

customizr-single-post-navigation

At the bottom of a single post, the theme displays a block of navigation links to the previous and next post (sorted by dates).

Post list

 customizr-post-list-navigation

For lists of posts like home, archives (categories, tags, dates, author), search pages, Customizr displays a navigation block at the bottom of the list, with links to the previous and next pages of posts.

Sidebars and footer widgets

Customizr offers five “widgetized” areas :

  • 2 for sidebars : sidebar left and right
  • 3 in footer : left, middle, right

If you want to customize those areas, go to Appearance > Widgets and drag’n drop your desired widgets in any of the widget areas.

 

 

Recommended plugins

Performance

On the web, speed is key!

High performance web sites lead to higher visitor engagement, retention and conversions

 

Google

Each time a web page has to get an external ressource (stylesheet, javascript file, image, …) , it increases the loading time of the page. However, since browsers cache the css and javascript it is better for performance standpoint to make those ressources external than to embed them directly in your webpage.
To minimze the number of http requests to get all external ressources, the best solution is then to compile them into compressed files (one for CSS and one for js for example).

There are good plugins to handle this : Total Cache and Super Cache are your friends. I use W3 Total Cache on most of my WordPress websites. Very good, free and highly reliable. Must used!

Have you checked if your website loads fast? If not then test it with the following online tools and see what kind of improvements you can make :

Before implementing any performance plugins on your website try to compress your pictures as much as possible. There are many ways to do that but some online tools like tinypng.org are doing it very well.

Security

The web is not a safe place. As of 2013, WordPress powers almost 20% of all websites. Every WordPress install are similars, and hackers are well aware of that! You must protect your WordPress install. Here are two interesting plugins to do reinforce your security :

Good practice 1 : Always keep all your active WordPress components (themes and plugins) up-to-date, including WordPress itself of course.

Good practice 2 : Delete inactive themes and plugins in your install. Always.

SEO

To become Google’s best friend, I recommend WordPress SEO by Yoast : the best SEO plugin for WordPress to me,  and very easy to configure.

Images

      • Regenerates thumbnails : the plugin to generates Customizr specific image sizes
      • Unveil Lazy Load.  Drastically improve page loading time.  Load an image when it’s visible in the viewport.

Videos

      • Lazy load for videos. another good plugin to boost page loading performances. the plugin basically replace the quite heavy Youtube / Vimeo ifram by a screenshot. On click, the video is loaded and replace the screenshot.

 

Sidebars

      • Custom sidebars :  Great and fully Customizr compatible plugins. Allows to create your own widgetized areas and custom sidebars, and select what sidebars to use for each post or page.

 

Child Theme

 

Developers

 

 

Support

If you face problems with the theme and you are not sure what to do , then:
1) Watch the Introduction video again
2) Watch the Creating A Slider video again

Hint : get the basics working before you try to do anything further.

If you still can’t fix your issue, we’ll try to get you going in the user forum on the WordPress.org platform. Just to help us, please check the following before jumping into the forum.

Search

Search for your symptoms, as there may already be a solution to your problem in either the Forum or the Code Snippets.

Check your plugins

Many issues are caused by conflicts between the Theme and Plugins. If you consider the combinations, there could be an infinite number of root causes for such problems. We are not flawless and we have been known to find bugs our code. Our solutions are easy and we can ‘fix in next release’.

Beside, we have NO control over plugins. You must take responsibility for reporting any conflicts to the Plugin Author, or you may have (in extreme cases) to choose another Theme if the Plugin is the most important part of your solution.

The easiest way of diagnosing if a Plugin is the root cause, is to Deactivate them all and then Activate each in turn. Test after each one is re-activated until the error happens – that’s the culprit. To quickly Deactivate all Plugins, rename the wp-content/plugins folder to anything else (eg _plugins, oldplugins). Do the Zero-Plugin test and if it looks OK, rename back to wp-content/plugins and start to manually Deactivate them all, then Activate one at a time.

Check your configuration

Check your configuration is setup correctly. Some problems (eg White Screen of Death – WSOD) are typically caused by problems with the .htaccess and wp-config.php files. If you have a localhost system, did you ftp the latest files back to the Server?
Hint : I resist deleting files until I’m sure I have a solution. So you will find .htaccess.notworking, .htaccess.saved, wp-config.old etc on my hard drive.

Report

Guess what, we’re waiting to hear about your problem now! When you raise a new Topic in the Forum, give it a meaningful description that may be searched for in the future. Please do not latch on to an existing Post and add further questions. Typically, these are already marked [resolved] and do not get any urgent attention. If you have a site that is accessible, please remember to include a url so we can take a look at the problem.

And when we have sorted your problem out, please be courteous and mark it [resolved] in the right hand sidebar. We then know we have another satisfied user.

Contribute

If you appreciate the theme and want to give back in return, your contribution is welcome of course! I always need help in the support forum. So if you think you can share your skills, that’s just great! It is also a very good way to learn as we faces new problems and code challenges everyday.

I take the occasion to thank three Customizr users here who became part of the story :  Electricfeet, RdellConsulting and Acub. They all started by answering questions in the forum and quickly became expert with the theme. Now they also share their knowledges in the snippets section of this website.

We are here to help you, and request nothing in return. Please, take the time to identify clearly your problem and check if it is not already solved on this site or on the forum. That way, we can focus more on the theme continuous improvements, to make Customizr the best free theme for you!

 Customizr support forum.

Icons for developers

Customizr uses two handy sets of fonts : Genericons (made by Automattic) and Entypo. You can use them just like a normal font and use CSS properties like color, size, gradients, … Perfect for beautiful and light weight web design.

Genericons

 All informations about how to embed the Genericons font here : http://genericons.com/

Entypo

 More information on how to embed the Entypo font here : http://www.entypo.com/

Glyphicons

To use those icons, insert the following type of code :

<i class="icon-search"></i>  or and for icons in white color :  <i class="icon-search icon-white"></i>

 More information on how to embed the Glyphicons font here : http://getbootstrap.com/2.3.2/base-css.html#icons

Twitter Bootstrap Components

Customizr is built with Twitter Bootstrap v2.3.2. The following is a demonstration of what you can use in the Customizr theme including the code ready to paste in your devs.

Buttons

   

  <button class="btn btn-large">Default</button>&nbsp;<button class="btn">Default</button>&nbsp;<button class="btn btn-small">Default</button>&nbsp;<button class="btn btn-mini">Default</button>

   

  <button class="btn btn-large btn-primary">Primary</button>&nbsp;<button class="btn btn-primary">Primary</button>&nbsp;<button class="btn btn-small btn-primary">Primary</button>&nbsp;<button class="btn btn-mini btn-primary">Primary</button>

   

  <button class="btn btn-large btn-info">Info</button>&nbsp;<button class="btn btn-info">Info</button>&nbsp;<button class="btn btn-small btn-info">Info</button>&nbsp;<button class="btn btn-mini btn-info">Info</button>

   

  <button class="btn btn-large btn-success">Success</button>&nbsp;<button class="btn btn-success">Success</button>&nbsp;<button class="btn btn-small btn-success">Success</button>&nbsp;<button class="btn btn-mini btn-success">Success</button>

   

  <button class="btn btn-large btn-warning">Warning</button>&nbsp;<button class="btn btn-warning">Warning</button>&nbsp;<button class="btn btn-small btn-warning">Warning</button>&nbsp;<button class="btn btn-mini btn-warning">Warning</button>

   

  <button class="btn btn-large btn-danger">Danger</button>&nbsp;<button class="btn btn-danger">Danger</button>&nbsp;<button class="btn btn-small btn-danger">Danger</button>&nbsp;<button class="btn btn-mini btn-danger">Danger</button>

   

  <button class="btn btn-large btn-inverse">Inverse</button>&nbsp;<button class="btn btn-inverse">Inverse</button>&nbsp;<button class="btn btn-small btn-inverse">Inverse</button>&nbsp;<button class="btn btn-mini btn-inverse">Inverse</button>

 

  <button class="btn btn-large btn-block btn-primary" type="button">Block level button</button> <button class="btn btn-large btn-block" type="button">Block level button</button>

 

  <button class="btn btn-large btn-primary disabled" disabled="disabled" type="button">Primary button (disabled)</button> <button class="btn btn-large" disabled="disabled" type="button">Button (disabled)</button>

 

Labels and badges

Default Success Warning Important Info Inverse

 

1 2 4 6 8 10

 

 

Alerts

Warning!

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

 

Error!

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

 

Success!

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

 

Info!

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Progress bars

 

 

Grid

Check this snippet about Bootstrap grid and layout in Customizr WordPress theme.

 

Going further with customizations For developers

If you need to dive a bit more in the code for your customizations, the theme offers tools that will make your life easier.

Custom css

customizr-custom-css

This is going to take a little bit of knowledge of CSS. This is where the Custom CSS Panel comes into its own and provides a really powerful tool for applying CSS changes and seeing the effect immediately. Just remember to click the Save & Publish button to keep your changes.

Hint : escape all single and double quotes if you need to insert some (example selector:before {content : \'Hello\';}  )

New :  guide to CSS and HTML in the Customizr theme

Templates in Customizr

The theme uses four  templates to render the content :

      • header.php
      • index.php
      • footer.php
      • comments.php

Those templates only includes some structural HTML markup, the rest of the front end content is rendered with the action hooks defined in the classes of the parts/ folder.

As you might have noticed, Customizr does not really use the WordPress template hierarchy, but there are no restrictions to use it in your developments, for pages, custom post types, taxonomies, etc…

Customizr loop

Customizr uses one single loop for all kind of content. It is located in index.php.  The different kind of content (posts, pages, lists of posts, 404, no-result) are displayed through action hooks defined in the /parts/* classes and filtered by the conditional booleans : is_singular(), is_404(), is_search(), is_archive(), is_page()…

Hint : check out this snippet to alter the main loop in Customizr WordPress theme.

Customizr hooks API

The Customizr theme makes an extensive use of the WordPress hooks. This choice has been made to have a better structured code and avoid dependencies. The theme has its own hooks API which makes customizations a lot easier.

In Customizr, action hooks are used to render HTML or execute some code in predefined locations, while filters are used either to get values or modify html output (usually rendered by actions).

The best and safest way to customize the Customizr theme, is to use those actions hooks. You can add actions ( add_action( 'hook-hame','your-function-name', $priority, $arguments)  ) to existing hooks and order them with the priority parameter.

Go to the Customizr theme hooks API.

Code snippets new!

The Customizr theme has been designed to be as much customizable as possible for webdesigners but also for developers. Therefore we have developed a number of Code Snippets which you can find on the Themes & Co website.

These have been gathered after months of supporting the Forum and seeing the common issues Users have. They provide generic solutions to common issues, but try to understand the code rather than just cut & paste. It may be that you need to tweak the code to achieve exactly what you want.

Example of ready-to-use pieces of code you can find :

      • modify the css : menu, fonts, backgrounds, slider,…
      • re-arrange blocks of content in the website : add actions, filters, etc…
      • add new type of content,

Each snippet is tagged with : language (php, css, javascript…) , target (header, body, footer…), hook and function. This way you can easily find the code you need to customize your website.

Check out the code snippets

 

 

License

gpl_logo_smallCustomizr is licensed under the GNU GPL v2 or later.

You can use it for commercial or non commercial projects.

 

Thanks

First of all, Customizr would never have existed if WordPress had not been created, 10 years from now, by the very inspired Matt Mullenweg. Thanks to him for developing the best CMS in the world! The people below are all volunteers or developers who share their amazing code with the world.

 

WordPress Review Team

Those guys are doing an awesome job! They are a bunch a volunteers, WordPress experts, reviewing every single theme submitted to the WordPress.org platform. They carrefully check if each theme is compliant with the guidelines (which is quite a big task to do believe me!). So thanks to them, and especially to the guys who reviewed and approved Customizr :

Customizr contributors

Customizr core code contributors

 

Translators

      • Joris Dutmer (nl_NL)
      • Evgeny Sudakov (ru_RU)
      • Igor (ru_RU)
      • Marcin Paweł Sadowski (pl_PL)
      • Johnny Nyström (sv_SE)
      • Andrea (it_IT)
      • Roner Marcelo (pt_BR)
      • Rodrigo Stuchi (pt_BR)
      • María (es_ES)
      • Pia Wiche (es_ES)
      • Martin Bangemann (de_DE)
      • Luckie Joy (zh_CN)
      • Ramez Bdiwi (ar)
      • Andrei Georghiu (ro_RO)
      • Ferencz Székely (hu_HU)
      • Jaume Albaigès (ca_ES)
      • Ahmet Hakan Ergün (tr)
      • Martin Filák (cs_CZ)

Documentation credits : Thanks to Dave Bardell for his kind help and advices to write this documentation