Bookmark and Share

At Blog Design Studio, we follow certain procedures for developing the WordPress themes & plugins. Today, I’m posting one of the procedure that we follow to clone the live location of our client’s WordPress install to a test location.

That way, we can continue the development without worrying about disturbing the user experience of the visitors and once the development is done, we clone the test location back to the live location. That’s how we minimize bugs & issues. I’ll post the guide to clone the testing location back to live location as well, however will release that next week. You can subscribe to our newsletter to ensure that you don’t miss it!

Purpose: We want to clone the blog from live location to another folder with in current webhost. This ensures the development can be done with minimum bugs. For e.g. http://blog.com will be cloned to http://blog.com/testlocation/ and it will function in exact same fashion as http://blog.com

Pre-requisites:

  • SSH enabled FTP account. SSH is secure shell that gives access to the linux servers thus making the process a little technical but fast, secure and we face less issues.
  • Domain name access
  • Web host control panel access for access to database.
  • Putty – Windows based software to access SSH. Download here. [choose A Windows Installer]
  • FileZilla – FTP software | Download here.

Example settings:

  1. FTP account with ssh
    1. Username: bdstest
    2. Password: bdstest123456
    3. Public folder location – /public_html/
    4. Test folder location – /public_html/test/
  2. CPanel account details
    1. Domain name: http://bdstest.com
    2. Server IP : 202.143.12.34 {this is made up}
    3. CPanel URL: http://202.143.12.34/cpanel/ [not every webhost comes with CPanel, some come with their own control panel – so you’ll have to follow the instructions accordingly or contact web host]
    4. Username : bdscpanel
    5. Password: bdscpanel123

Pointers –

· SSH commands are in Italics

Process to follow

  1. Make the backup of files
  2. Extract the backup of files
  3. Export the database
  4. Create a new database
  5. Import the backup of database
  6. Change the URL structure of the database
  7. Put new database settings in wp-config
  8. Block Search engines
  9. Create a new user in live location
  10. Upgrade WordPress

Process Starts

1. Making the back-up: The first step is to ensure that we make the backup of all the files. We’ll connect through SSH and will navigate to the folder where WordPress is installed and will run these commands -

  • Open Putty [enter the ip address of server or domain name at the place shown in picture 1] & click Open
  • Enter the SSH enabled username & password.
  • ls {lists the files & folders}
  • cd public_html {change directory from existing to public_html}
  • tar -cvf wholeblog.tar ./ (this will ensure that all the files in the folder gets packed in a file called wholeblog.tar)
  • mkdir test {creates a folder in public_html with the name test}
  • Don’t close the putty window.

pic1

2. Extract the back-up: Now we’ll move the backup file i.e. wholeblog.tar to test folder & will extract the files.

  • Open Filezilla
  • Enter the server details to connect to the server and go to public_html folder.
  • Drag and drop the file wholeblog.tar to test folder
  • Go back to the putty window and type the following commands –
  • cd test
  • tar –xvf wholeblog.tar

3. Export the database: We’ll use phpMyadmin to export the database.

  • Go to CPanel i.e. http://202.143.12.34/cpanel/
  • Enter username & password
  • Scroll down and find phpMyAdmin
  • If asked for username & password enter then accordingly. If you don’t remember it, you can find the information in wp-config.php, which is stored in /public_html/ folder.
  • From the main login screen, select ‘Databases’
  • Now click the name of your database – or your WordPress database if you have several databases. (Your screen may look slightly different, depending on the version.)
  • click the ‘Export’ tab on the top set of tabs. (1a)
  • Look at the left box at the top of the Export section. All the tables in the database you selected are in that box. Click on Select All (1b)
  • Tick the ‘Save as file’ option, “gzipped” radio button and leave the template name as is. (1c)
  • Now click ‘Go’ and you should be prompted for a file to download. Save the file to your computer.
  • Depending on the database size, this may take a few moments.
  • You have now backed up your database.

phpmyadmin
(click for bigger picture)

4. Create a new database: Creating a new database is pretty simple with the help of CPanel.

  • Go back to Cpanel.
  • Look for MySQL Database Wizard & click it.
  • Step 1 -> type the name of the database and click Next.
  • Step 2 -> type the username , generate the password and then click Create User.
  • Step 3 -> Click All Privlidges & click Next.
  • Ensure all the information is stored somewhere safe and then click on “Return to Home”

mysql-wizard

5. Import the backup database: In this step we’ll import the database that we exported in step 3.

  • Login to phpMyAdmin.
  • Click databases, and select the database that you created in step 4.
  • Across the top of the screen will be a row of tabs. Click the Import tab.
  • On the next screen will be a Location of Text File box, and next to that a button named Browse.
  • Click Browse. Locate the backup file stored on your computer.
  • Make sure the SQL radio button is checked.
  • Click the Go button.

6. Change the URL Structure: This is required to change the URL stored in the database from http://bdstest.com to http://bdstest.com/test/

  • go to SQL tab and run these sql queries one by one –
  • UPDATE wp_options SET option_value = replace(option_value, ‘http://www.old-domain.com’, ‘http://www.new-domain.com’) WHERE option_name = ‘home’ OR option_name = ‘siteurl’;
  • UPDATE wp_posts SET guid = replace(guid, ‘http://www.olddomain.com’,'http://www.newdomain.com’);
  • UPDATE wp_posts SET post_content = replace(post_content, ‘http://www.old-domain.com’, ‘http://www.new-domain.com’);

Note: if you are making the clone in a sub-folder then then URL in the queries should be like this – http://www.new-domain.com/subfolder [there should be no trailing slash at the end]. In our example old domain will be http://bdstest.com & the new domain will be http://bdstest.com/test

7. Modify settings in wp-config.php: Now’s the time to change the settings of wp-config in test location.

  • Go to /public_html/test/ using Filezilla.
  • Right click on wp-config.php & select View/Edit.
  • File will open in default text editor.
  • Put the new values of database that you created in step 4 – You would need to change, the database username, database password and database name.
  • Click Save.
  • Exit Filezilla.
  • Open the test location to verify if everything is correct or not!

8. Block Search engines: We need to ensure that search engines don’t crawl the site.

  • Go to /public_html/ using filezilla
  • Look for robots.txt , if it’s not present, we’ll create a new file and will upload it to /public_html/ folder.
  • Open a text editor (like notepad on Windows) and create a new text document
  • Save the text document with exactly the name robots.txt
  • Paste the following text in that file –
    • User-agent: *
      Disallow: /test
  • Save the file, Upload the robots.txt to public_html.
  • Verify the robots.txt location by going to http://www.YOUR-DOMAIN.COM/robots.txt
  • If you have the robots.txt already, then just add the text in step 3 mentioned above.

9. Create a new user in original location: There are situations where the original site can’t stop posting new articles. To avoid any issues, we should create a new user and all the future articles should be posted using that new user.

  • Go to WordPress dashboard of original location
  • Go to Users->Add User
  • Username (required) – Enter the username of the new user here. This will also be used as the Login name of the new user.
  • E-mail (required) – Enter a valid e-mail address of the new user here. The e-mail address must be unique for each user. If a published post or page is authored by this user, then when approved comments are made to that post or page, a notification e-mail is sent to this e-mail address.
  • First Name – Enter the first name of the new user here.
  • Last Name – Enter the last name of the new user in this text box.
  • Website -: You may enter the new user’s website URL in this text box.
  • Password (twice) – Enter a password for the new user twice here, once in each text box.
  • Send Password? – Check the box to Send this password to the new user by email.
  • Role – Select the desired Role for this User from the drop-down box.
  • Click Add User

10. Upgrade WordPress to latest Version of test location: It’s best that one upgrades to the latest version of WordPress. The test location is the best place to find out if that’s possible or not.

  • Go to WordPress dashboard
  • Go to Dashboard->updates
  • Click on Update automatically
  • If you want, you can update all the plugins as well, however its a possibility that some things will break or change the way they used to work. So, be prepared to expect issues or probably new features as well.
Bookmark and Share

WordPress as we all know is the most fantastic blogging software and is turning in a great CMS. There are number of themes and plug-ins available on the internet and as its popularity is growing, many more designers and programmers are jumping in WordPress Design & Development. There are various cheat sheets and presentations available that are pretty useful in WordPress design & plug-in development, so we thought of listing most useful of the lot over here -

1. The WordPress Help Sheet

wphelpsheet

This wonderful Help Sheet contains information for the people starting with WordPress design and development. It contains commonly used simple php snippets for template files, header files and some more useful stuff. The document was created by WPCandy along with Liquidcity. However, the download link on WPCandy wasn’t working, so I’ve uploaded it on Scribd.

read full article →

Bookmark and Share

web10 Until late 90’s, online publishing wasn’t as easy as it is in current times, it was the evolution of Blogger that started to make this space easier for common person who are technically challenged. Although, it were CMSes like Drupal, WordPress, Joomla & various other open source systems that upped the game by giving more power in the hands of publishers at much lower cost as the whole platform is completely free, the only cost involved is customization of the platform and the way content is displayed which is nothing if we compare the power and flexibility we get using these content management systems.

It was the evolution of blogging that brought many significant changes in the web ecosystem and one of them is that there are far more webmasters now and hundreds of them are becoming professional webmasters every day. I personally believe that its WordPress that has contributed significantly in this space. Its user friendly, has great documentation and has awesome community around it. WordPress is fast becoming the first choice for every publisher, people are shifting on it and this increase in demand is making web design companies adopt WordPress and one of the reason why we see so many companies offering premium WordPress templates and companies offering WordPress design services.

With that, we thought of coming up with a resourceful post that’ll help the new Web designer turned WordPress designers in making their lives easy -

Resources for Coding

aptana

WordPress Codex: What can be better than the official codex itself? The documentation itself is wonderful and that is one of the reason why developers were quick to adopt WordPress.

WP Engineer: WP Engineer has lots of posts with codes and lots of posts with tips that are surely going to help beginners. It’s a must bookmark blog for all those who want to learn coding in WordPress.

Cheat Sheets: Dainis Graveris has listed 23 extremely useful cheat sheets for programmers and WordPress designers. This is one resource that you will love to the core.

Tutorials for Developing WordPress themes: Vandelay design has posted a fantastic list of tutorials that help newbie’s in understanding WordPress theme designing.

Coda Clips: Coda is a text editor for web developers (mac only), it supports keeping small snippets for faster and quicker development. To support that, they started Coda Clips blog that features frequently used snippets and is regularly updated.

WordPress Mailing lists: WordPress official mailing list is the best place to keep yourself up to date with that is happening around WordPress and what are the new changes or requests made by the community. It’ll not only keep you up to date with the current status, it gives you the idea about what may be the next big feature of WordPress.

WordPress plugins to help WordPress Designers – We’ve featured 9 plugins for WordPress that will surely help all the beginner’s in quicker development of WordPress themes.

WordPress Theme Frameworks

framework

A theme framework is the flexible foundation, that can be used to build WordPress themes faster and quicker, without worrying about coding various basic functionalities. Someone with prior experience in CSS would be able to quickly adapt to WordPress designing. We are listing some of the most popular theme frameworks over here.

Thematic – Thematic is a free, open-source, highly extensible, search-engine optimized WordPress Theme Framework featuring 13 widget-ready areas, grid-based layout samples, styling for popular plugins, and a whole community behind it. It’s perfect for beginner bloggers and WordPress development professionals.’’

Theme Hybrid – Hybrid is a user-friendly, search-engine optimized theme framework, featuring 15 custom page templates and 8 widget-ready areas, allowing you to create any type of site you want. Like WordPress, this theme is completely free and open source. You can use it for your client work or for a blog about your grandchildren. It is continuously being developed and has a community growing around it.

WP Framework – WP Framework was created to serve as the starting point in WordPress theme development. It accomplishes this by providing you with commonly used functions and features that modern WordPress themes should have. So when you start a brand new WordPress project, using WP Framework you’ll already have the basic functionality set so you don’t have to worry about mundane task like creating the loop, or recreating all the standard template files.

Carrington – Carrington is a CMS theme framework for WordPress from Crowd Favorite, that makes it easy to create unique looks for different categories, posts and comments just by creating custom templates.

WordPress Books for newbie WordPress designers

There are various books written for WordPress and many are yet to be published. There are some fantastic books for WordPress, although I would like to mention these books for those who seriously want to be WordPress designers.

  • Rockable Press – How to be rockstar WordPress Designer is a fantastic e-book as it is focused on those who want to shift from regular web designing and want to become WordPress designers.
  • Vladimir Prelovac (not an affiliate link) – Vladimir has created lots and useful and some of the most popular plugins for WordPress. He’s a great authority in WordPress plugin development. This book should be in arsenal of those who want to develop WordPress plugins.

I hope these resources will be useful for anyone who wants to be a pro WordPress Designer. If you know any more resources, then please point them to us and we’d be more than happy to include them here.

Bookmark and Share

One of the biggest factors for WordPress fame is the amount of development happening around this ever so wonderful content management system. The flexibility it gives to designers and programmers helps them generate inspirational WordPress design. If you would like to learn how to develop WordPress themes and create wonderful designs then you should head over to Small Potato’s ultimate tutorial series on how to create wordpress themes. Apart from that there are various WordPress plugins that’ll help you in WordPress design development, lets check them out -

1. Theme Switch & Preview

Nicolas Kuttler has created various small plugins, however this one is my favorite as it allows you to tweak the template online without breaking stuff for visitors. There is a widget and a shortcode to make switching WordPress design easily. The plugin gives various options and as a developer you’ll surely love them.

2. Maintenance Mode

WordPress design development should be done in such a way or locally [how to install WordPress locally] that it shouldn’t impact the development, however there are times when the site can look weird, while enabling the new theme on live environment. This is where, Maintenance Mode plugin comes in handy. It allows you to create a custom message that’ll be displayed to your visitors while you get to access the blog as normal.

3. User Switching

This is a fantastic plugin that lets you easily switch between the multiple users. In the past there have been few of our clients who allowed various low level user accounts and didn’t want them to see various settings in the dashboard, this is where this plugin can come handy. It allows you to quickly switch between users with the click of a button. It’s up to date and supports older and new versions alike.

4. Get the image

Get the image is a plugin that grabs images for you. You can grab the image and display it around the post using custom fields, WP’s post image feature or you can even extract it from the post itself. If you are playing around with post images, then this plugin can surely help you in easing the task. You can go through its implementation and frequently asked questions over here.

5. Query Posts

This plugin is like a dream come true for those, who aren’t loved by PHP. This plugin creates a widget that lets you display the posts the way you want. This is the widget that keeps users out of the code and gives them the ability to display items on their site how they want. It supports categories, tags, custom taxonomies, author, date, time- and a lot more.

6. NextGEN Gallery

I personally feel that this plugin should become part of WordPress Core. Not only this plugin is a complete CMS in itself for images, it has its own plugins too! I would say that this should become your must install plugin for WordPress, no matter if you are using it for WordPress design development or using it personally! It’s just too good to be true! This plugin powers our WordPress Design Portfolio.

7. YD Network-wide Options

YD Network-wide options plugin lets you easily replicate blog or plugin settings across the network of blogs on WordPress 3.0. It maintains backward compatibility with WordPress MU and is constantly updated by the author. This is a fantastic feature as it allows you to easily maintain the settings and update them regularly across the whole network install in WordPress 3.x.

8. Members

Just like User Switching, members is one plugin that lets you manage the member roles in WordPress. This plugin lets you manage the scope of roles. You can give and take features from roles, create new roles etc. This ensure that members will get only those privileges that you want them to have. A must have plugin if you want to use WordPress as CMS.

9. Custom Post Type UI

Custom Post Type UI plugin gives you easy to use interface for maintaining custom post types and taxonomies. WordPress 3.0 features better support for Custom post types and taxonomies and this plugin improves the interface tremendously. It’s a fantastic plugin and must be in every WordPress designer’s arsenal.

I hope you find these nine plugins useful enough for WordPress design and development. We’ll continue featuring these kind of plugins and various other tips. Please share the posts on Twitter, Facebook or any other social network using the buttons on the left.

Bookmark and Share

WordPress  is considered to be God-send CMS for designers & programmers. It gives enough flexibility for designers to not worry about what all can be designed and can be run on WordPress. We’ve compiled the list of those resources that list some of the most beautiful designs made to run on WordPress.

These design galleries and blog posts are great for the designers and if you are planning to get your WordPress designed then you should check out these resources to

WordPress Design Inspiration Galleries

1. We Love WP

we love wp wordpress design

We love WP is probably the best and most up to date gallery. It’s fantastic to see some good work constantly featuring in this web gallery for WordPress designs. One of the best part is that they’ve categorized the designs nicely thus making it easy to navigate industry specific designs. Guess what! They’ve featured us on their website as well :)

2. WP Candy

wp candy wordpress design

WP Candy has a WordPress design gallery. It hasn’t been updated since some time however; it remains one of my favorite destinations for WordPress design inspiration. WPCandy not only features the awesome wordpress designs, it also has great tips in its blog.

3. CMS Designs

cms design wordpress

CMS Designs is an inspirational showcase and gallery website with collected and submitted well designed blogs and websites powered by popular Open Source content management systems like WordPress. CMS Design features some good examples. It is updated slowly but regularly. There are some designs that are treat to watch. http://wordpress.cmsdesigns.org/

4. WordPress Showcase

wordpress showcase wordpress design

What can be better than the official directory of designs that rock! Team Automattic selects some of the coolest websites/blogs running on WordPress. It’s a great inspiration resource for WordPress designs as well as programming.

5. WP Garden

wordpress garden cms design

It’s a nice little directory run by Sadish Bala, a WordPress fan. I was personally not impressed by WP Garden’s own design but it certainly features some really nice WordPress designs across various categories. http://wpgarden.com/

6. WP Float

wp float wordpress design

WP Float has a good collection of WordPress Designs that give inspiration. They’ve even kept their tag line as WordPress inspiration. They’ve got pretty long list of various categories and have got loads of sites in each of them. Overall it’s a fantastic resource to get design inspiration.

Blog Lists that feature great WordPress Designs

7. Hongkiat – 100 nice and beautiful blog designs

WordPress 100 WordPress design inspiration

Hongkiat has listed some of the best blog designs across the internet in a blog post. 100 blog designs in a row is definitely an art work, all of the designs are inspiring and mostly are on WordPress. Even if they are not, what can’t be made in WordPess?

We spent weeks going through hundreds and hundreds of blogs in the blogosphere, looking for blogs with nice and interesting design. We marked down those with great interface, graphically beautiful, unique personalities and styles. Here we bring you – 100 Nice and Beautiful Blog Design.

8. SixRevisions – 45 beautiful and creative WordPress Designs

45 creative and beautiful wordpress design

Jacob Gube from Six Revisions has done a fantastic job by listing some of the greatest designs made that are running on WordPress. It is truly an amazing resource for WordPress creative design inspiration. Well not just that he even lists 25 outstanding WordPress designs in another post and that is also a true gem.

WordPress provides designers utmost control over a theme – resulting in unprecented flexibility in the layout and design direction he or she can take. WordPress – in the title – is inside parentheses because the designs you’ll see below are wonderful designs despite of the publishing platform they use (which just so happens to be WordPress).

9. Instant Shift – 55 excellent WordPress site design for design inspiration

WordPress Design inspiration

Daniel Adams has listed some unique and beautiful looking WordPress site design. The collection in that list is fresh and inspirational. It’s a link that should be in stored in your bookmarks. I’m sure you’ll find it as one of the best source for inspiration at all the times.

Anders Ross has also created a similar list that features 70 brilliant WordPress design for inspiration. It’s another wonderful resource that you must check out.

In this designs showcase we trying to present you exemplary design trends, new practices, creative ideas and designer’s skills. There are so many different WordPress designs out there that it’s always hard to decide which one to select. We spent last few weeks to compile this list of highly beautiful, creative and most importantly inspirational site designs over web which might help you to get inspired with their work.

10. Blog Design Studio – 35 Best WordPress Design Websites

WordPress Blog design WordPress design

Our last post was a super hit where we’d listed 35 websites that are using WordPress, WordPress MU or BuddyPress for running fantastic designs and use WordPress as CMS instead of just a blog software.  We listed only those websites that had fantastic design and great programming.

Popularity of WordPress is clear in its own way, however it becomes crystal clear when we see small businesses, professionals or even big corporations are giving preference to WordPress over other CMSes. WordPress as a CMS has evolved and is used to build beautiful and professional websites.

Bookmark and Share

Popularity of WordPress is clear in its own way, however it becomes crystal clear when we see small businesses, professionals or even big corporations are giving preference to WordPress over other CMSes. WordPress as a CMS has evolved and is used to build beautiful and professional websites. Lets check out the following 35 websites that are powered by WordPress, BuddyPress, WordPress MU and aren’t used just as blog.

1. h Mag

h MAG is a high end luxury magazine for the Hoboken market. They print 15,000 copies that are placed in every room at The W Hotel, delivered to every doorstep in town, distributed to over 100 retail establishments and handed out at the Path and Ferry stops. h Mag uses BuddyPress & WordPress MU to publish variety of content and is a highly interactive site and design.

2. Creative Ad Awards

Creative Ad Awards

Creative Ad Award is a fantastic advertising archive, serving advertising fans with high quality ads. They provide world’s most sophisticated, creative and fresh ads. Creative Ad Awards has highly customized WordPress to achieve this kind of design.

read full article →

Bookmark and Share