“WP Pro Real Estate 2” Documentation by “Chris Robinson (contempoinc)” v1.6.1

“WP Pro Real Estate 2”

Created: 10/15/2010
By: Chris Robinson (contempoinc)
Email: [email protected]

Thank you for purchasing my theme. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here.

You can also view my ThemeForest profile here, visit my theme and stock art preview site here, or follow me on Twitter here.

Installation & Screencasts
Translation
Custom Shortcodes
CSS Files and realestate_2
JavaScript
PSD Files
FAQ

A) Installation & Instructional Screencasts - top

Please follow the installation initial instructions below:

Unzip the final zip file; you should now have a final download folder.
Do NOT upload the final download folder. Open up the final download folder.
Browse the contents and find the realestate_2 theme folder.
Upload ONLY the theme folder to your "wp-content/themes" folder.
- Optional: If you do not wish to manually upload the theme only folder to your "themes" folder, there is an option. You can zip up the theme folder (remember, ONLY the theme folder) and upload it via the WordPress themes admin panel by selecting "add new" and clicking "upload".
Login to your Wordpress admin and navigate to Appearance > Themes > locate "WP Pro Real Estate 2" and activate it.
Once activated you will be redirected to the Options panel, where you can configure the theme. Make sure to throughly go through each panel and famalirize yourself with everything, there are a bunch of options to configure. Please also see the Quick Walkthrough Video.
If this is a new installation and you would like some dummy content I've included an XML file with all the content from the theme demo.
1. Go to Tools
2. Click Import > Select Wordpress
3. Click Browse > Find the supplied "wpprorealestate2.wordpress.2011-08-03.xml" located within the main folder
4. Click Upload file and import
5. That's it!

You'll notice the theme makes heavy use of Taxonomies for the Listings, each of these are detailed out below:

Property Type: Can be anything you wish and as many as you like, in the demo I've only used two Condo/Townhome & Single Family Home.
- Land or Lot: Any listing given this type will remove the "bed, bath & on" sitewide.
Beds: Number of beds, can be any amount you like.
Baths: Number of baths, can be any amount you like.
Status: Can be anything you wish and have as many as you like, in the demo you'll notice I've used a few. Although there are some that are necessary to add for certain functions.
- Featured: Any listing given this status will appear on the homepage area.
- For Rent: Any listing given this status will add "Rental" text in front of the price.
- Reduced: Any listing given this status will add a red "Reduced" flag over the image across the site. Example
- Sold: Any listing given this status will add an orange "Sold" flag over the image across the site. Example
- Open House: Any listing given this status will add a green "Open House" flag over the image across the site. Example
City: City the listing is located in, used for mapping.
State: State the listing is located in, used for mapping.
Zipcode: Zipcode the listing is located in, used for mapping.
Additional Features: Can be anything you like, and as many as you like. Some I've used in the demo: Concierge, Forced air heat, Family room is 20×12, Single story, etc…

Uploading Listing & Blog Post Images:

Listings: No messing around with copy/pasting URL's for images, this theme makes it so easy to add unlimited photos to your listings:
1. Open up a listing
2. Click Add Media button
3. Click Upload
4. Select all your files you wish to upload
5. Once uploaded, click the X (top right)
6. That's it! You can close the window, click Publish or Update and view your listing.
7. Now if you would like to select a different first image or re-order the other images for the slider:
  1. Open up a listing
  2. Click Add Media button
  3. Click the Media Library tab
  4. Select Attached to post
  5. Now you can click and drag your images around to sort them, the first image in the list will always be your main image.
Blog: Blog postings work the same way as above however they only support one main image.

Building out your navigation

You'll use Appearance > Menus to build out your navigation. What you can do is use the Advanced search area and select one or mulitple taxonomies to search on and that URL that is generated you can use to build a Custom Link for your navigation.

For instance:

For Sale & San Diego:
http://yourdomain.com/?ct_city=san-diego&ct_status=for-sale&property-search=true
For Rent
http://yourdomain.com/?ct_status=for-rent&property-search=true
1 Car Garage
http://yourdomain.com/?ct_additional_features=1-car-garage&property-search=true
3 Beds
http://yourdomain.com/?ct_beds=3&property-search=true

Using Permalinks

If you want to enable pretty permalinks, I highly suggest you use this custom structure /%year%/%monthnum%/%postname%/

B) Translation - top

Need to translate the theme into another language? No problem, it's fully localized and translation ready. Follow the simple steps below:

1. Download and install PoEdit.

We need PoEdit to translate a theme. Its a free software and its available for Mac, Windows and Linux. Download PoEdit from this page.

2. Create a new catalog (the local language file)

Start PoEdit and click on the File menu and select the option New catalog from POT file.
This will open the file dialog box. Go to the languages folder of the theme. Select All Files from the file dialog box, and open the en_US.po file in the languages folder.
Now PoEdit will ask you for various configuration options. The most important thing here is to choose the correct country and language you are translating to.
In the remaining fields of the configuration window, fill the required information or just leave them empty.
Now click on the Paths tab and change the path variable to the place where your theme files are located.
Then press OK.

Now PoEdit will ask you to name the file. Its very important to name the file correctly. The naming convention for these files is languageCode_countryCode. The language code must be in lower case while the country code should be in upper case. So, if you are translating the theme for UK English, the file name will be en_UK. Similarly, for translation to french, it will be fr_FR and so on. You can find a list of language codes at this page and country codes here.

3. Translate the Theme

This is the step where we will actually translate the theme. After Step 2 above, you'll see the standard interface of PoEdit where the left panel contain the strings in the original language and the right panel containing the translations. The right panel will be empty as we haven't started the translation yet.

Start translating each string one by one. Click on the first string and press Tab button. This will take you to the translation box in the bottom. Type the translation here. Your change will reflect immediately in the right panel. Once you are done with this string, press Enter and move on to the second string. Repeat this procedure until all the strings are translated. After the translation is done, save the file.

Then open wp-config.php located in the root of your WordPress installation and change line 72 to reflect your new language file.

4. Upload The Files To Your Server

When you save the catalog file in Step 3 above, PoEdit will create two files, a .po file and a .mo file. Upload both these files to the languages directory of your theme. Also upload wp-config.php to the root of your WordPress installation and you'll be good to go.

C) Custom Shortcodes - top

This theme comes loaded with 22 custom shortcodes, all to make your life oh so much easier. What are shortcodes? They're are simple macro codes to be used in WordPress post content. There's no need for any HTML knowledge!

Using shortcodes has never been easier, they can all be used directly from the Post Editor toolbar using the quick insert buttons.

Content shortcodes and instructions can be found here
Layout shortcodes and instructions can be found here

D) CSS Files and realestate_2 - top

Main Stylesheet - style.css

This file contains general styling, such as anchor tag colors, font-sizes, etc and specific element styling. The file is separated into sections using:

                /** Container
                ==============================================================================*/
            
                	some code
            
                /** Floats
                ==============================================================================*/
                
                	some code
                
                /** H Tags
                ==============================================================================*/
                
                	some code
                
                /** Links
                ==============================================================================*/
                
                	some code
                
                	etc, etc.

If you would like to edit a specific section of the site, simply find the appropriate label in the CSS file, and then scroll down until you find the appropriate style that needs to be edited.

Font Stylesheets

Each of these stylesheets uses @font-face to import custom fonts.

colaborate.css - properties for the Colaborate font
museosans.css - properties for the Museo Sans font
museoslab.css - properties for the Museo Slab font
quicksand.css - properties for the Quicksand font
sansation.css - properties for the Sansation font
titillium.css - properties for the Titillium font

Other Stylesheets Included

css/custom-nivo-slider.css - skin styles for the Nivo slider.
css/nivo-slider.css - main styles for the Nivo slider, recommend leaving this file alone.
css/validationEngine.jquery.css - form validation styles, recommend leaving this file alone.

E) JavaScript - top

This theme imports six Javascript files.

jQuery - jQuery is a Javascript library that greatly reduces the amount of code that you must write.
jquery.validationEngine.js - The form validation is handled by this file, this one doesn't require any editing.
jquery.tweet.js - This is the main tweet file, this one doesn't require any editing.
jquery.prettyPhoto.js - This is the main PrettyPhoto file, this one doesn't require any editing.
core.js - This is the main JS file it controls a few different things, its well commented for easy customization.
jquery.nivo.slider.pack.js - This is the main Nivo slider file, this one doesn't require any editing.

F) PSD Files - top

real_estate_2_layout.psd
real_estate_2_listing_layout.psd
real_estate_2_archive_layout.psd
icons.psd
nav_drop_bg.psd

If you'd like to change the color of the featured hatch pattern on the homepage, open "real_estate_2_layout.psd", find the content folder > featured folder > info folder > and make the necessary adjustments to the bg layer, go to File > Save For Web select the slider_arrows slice > Select PNG 24 > save the file into the images folder overwriting the existing file.

G) FAQ - top

Q: My request more info widget and contact page aren't working?

A: Make sure in WP Real Estate 2 Options > Contact > Success that your message is restricted to one line, meaning there's no line breaks. Otherwise this will break the validation/processing script.

Q: I get a "Broken Theme/Stylesheet Missing WordPress" error when uploading or activating?

A common issue that can occur with users new to installing WordPress themes is a "Broken theme and/or stylesheets missing" error message being displayed when trying to upload or activate the theme.

This error message does not mean that the theme you have purchased is broken, it simply means it has been uploaded incorrectly.

Luckily, there is a very easy fix: http://wiki.envato.com/buying/support-buying/solving-broken-theme-issues/

Q: My images aren't showing up?

Make sure realestate2 > img_resize > cache folder is set to 777
Make sure you have GD library installed on your server, comes by default wtih any running PHP 4 .3+
Your hosts server security might be blocking timthumb from working more on this here if you're on HostGator you'll need to contact support and have them disable mod_security.

Q: Having trouble with pagination on your Agents page with custom permalinks enabled?

A: Try disabling all plugins and change permalink settings back to default, then change permalinks back to your custom structure.

Once again, thank you so much for purchasing this theme. As I said at the beginning, I'd be glad to help you if you have any questions relating to this theme. No guarantees, but I'll do my best to assist. If you have a more general question relating to the themes on ThemeForest, you might consider visiting the forums and asking your question in the "Item Discussion" section.

Chris Robinson

Go To Table of Contents