To build a complete website you need to buy a domain name and a server to host your website files. But if you don’t want to launch your website right away and want to set it up completely before going live, set up everything locally.

Why you should install WordPress on localhost?

When you set up WordPress locally, all the files will be stored on your local computer, and this means only you will be able to access your website. This is a great way for you to learn, making a website for free of cost. Also, this gives you a great testing environment that doesn’t affect your live website.

Step 1 – Download and install XAMPP server on your PC

To install WordPress, you need an Apache web server, PHP and MySQL database. All are separate open-source software and installing this software one by one will be a difficult job for beginners. This is where XAMPP comes into the picture.  XAMPP is an easy to install Apache distribution containing Apache web server, PHP and MySQL bundled together. 

Download XAMPP from XAMPP’s official website. Select your operating system and click on the download button.

Wait a few moments after hitting the download button. Because the file is around 150 MB in size, it will take some time to download. After downloading the file, double click the executable file and follow the installation process. 

Click on the Next button.

On this screen, some of the checkboxes will already be checked. It is enough to select Apache, MySQL, PHP and phpMyAdmin and click on the Next button. On the next screen, select the path where you want to install the XAMPP server. You can leave it as default c:\xampp. Click on the Next button.

Once the installation is complete, remove the tick mark “Do you want to start the control panel now?” and click on the Finish button. We have to run the XAMPP control panel as administrators.

Step 2 – Run the XAMPP server and test it

Once the XAMPP installation is complete, you will need to run XAMPP as an administrator on Windows. To do that, click Start, find XAMPP Control Panel in your Programs list, then right-click and select Run As Administrator. Another option is to go to C:/xampp where you have installed the XAMPP server, run xampp_start.exe as administrator.

This will launch the XAMPP Control Panel.

First, run Apache and MySQL services on the left side in the Control panel. Observe the green tick mark. This will register the Apache and MySQL server as service and it will start the server on every system reboot. Now click on the Start button for both Apache and MySQL which should look like the below image.  You can track the green running status near to it.

Now is the time to test the XAMPP server. Open http://localhost, if everything is good then it should open the page like the below image. 

Step 3 – Download the latest WordPress Version

The next step is to get the most recent version of WordPress from the WordPress.org website. It will be downloaded in a zip format. Open to https://wordpress.org/download and click on Download WordPress.

This will download a zip file. Extract the files to C:/xampp/htdocs folder as shown below. You are free to change the folder name from wordpress to anything else.

Step 4 – Create a Database

WordPress uses a database to store the text contents. We will create a MySQL database using the phpMyAdmin tool. Open http://localhost/phpmyadmin to launch phpMyAdmin.

Click on the tab Databases, enter the database name and click on create button. This will create a database. You can name the database whatever you want.

Step 4 – Install WordPress on Localhost

We have set up the server and a database. Now is the time to install WordPress. Open http://localhost/wordpress on your browser. This will redirect to the WordPress installation wizard. Follow the below-given steps to install WordPress. 

On the next step, enter the database name(it is “wordpress” in our case), root as username, leave the password blank as we have not set any password for root user. Click on the Submit button. 

Provide the Website title, a username and a strong password, email id. For security reasons, don’t use admin as a username.

After a successful installation, the success message should show.

Click on the login button or open the URL http://localhost/wp-admin to log in. Enter the provided username and password, click the login button.

This will open the WordPress dashboard. This is your backend dashboard or admin panel, from where you would control everything.

Now is the time to visit your local website. Open http://localhost/wordpress

So, give it a shot and let me know if you have any questions in the comments section below. I’ll be happy to assist you!

The post How to Install WordPress on your Windows localhost Using XAMPP(4 Steps) first appeared on Student Projects.

Now the problem is Buddypress is having its own theme. If you are installing buddypress in separate subdomain with separate wordpress then it is fine, you no need to worry at all. It will have its own theme and design. Now if you want buddypress features should be a part of your website then you need to integrate buddypress theme to your existing wordpress theme.

Here are the simple step by step procedure to make buddypress compatible wordpress theme.

Step 1: Install wordpress – Get latest from wordpress.org,
It is always better to try in your localhost and once it is perfect then upload it to your actual website. Know more about how to install wordpress on localhost.

I have installed wordpress on localhost and the link is http://localhost/wordpress/. When I brows my website it will be as shown below.

Step 2: Install buddypress plugin –
Download from wordpress Plugin directory and upload to plugin folder and activate it.

Also you can upload through Plugins->add new from dashboard.

Step 3: Update Permalink structure
If default permalink structure is configured in your blog then you will get below message.

Buddypress is almost ready. You must update your permalink structure to something.

Click “Update your permalink structure” link or brows Settings->permalinks and update as shown below. Select custom structure and write

/%category%/%postname%/

Once you click save button a message should come “Permalink structure updated“. If you get a message linke “You should update your .htaccess now” then your .htaccess file is not writable and you need to manually update given code.

Once permalink structure is updated and if you brows any other page you will get a message like

BuddyPress is ready. You’ll need to activate a BuddyPress compatible theme to take advantage of all of the features. We’ve bundled a default theme, but you can always install some other compatible themes or upgrade your existing WordPress theme.

Just leave it for time being. We are on the way to make the compatible theme.

Step 4: Install bp-template-pack and configure

Download from WordPress plugin directory and upload to plugin folder. Also you can install through Plugins->add new

Once the installation is done Brows Appearence->BP Compatibility and follow the instructions step by step.

Step one:

Click Move Template files button.

Step Two:

You will get a message like:

Adding support for BuddyPress to your existing WordPress theme can be a straightforward process by following the setup instructions on this page.

Templates moved successfully! This is great news, BuddyPress templates are now in the correct position in your theme which means you can skip step two and move on to step three.

This says your template files from buddypress theme moved to your pressent website theme.
If you check your template folder, you will be surprised. There are many files.

Click to move step three.

Step Three: There are some instructions to make the theme compatible. I will explain one by one in next steps.

Step 5: Making theme compatible:

bp-template-pack plugin copied all the template files to your theme folder. Now your job is to make it look like actual website or blog. bp-template-pack plugin wont copy the css file. So first move the folder _inc from wp-content\plugins\buddypress\bp-themes\bp-default to your present theme.

Open style.css of present theme and add the below line at the begining only.

@import url( _inc/css/reset.css );

Make sure you have copied _inc folder.

Now you need to manually add the links to

• Activity
• Members
• Groups
• Discussion
• Register

Open your site header.php or sidebar.php, wherever you need these menus. Add the below links.

<li><a href=”http://localhost/wordpress/activity/”>Activity</a></li>
<li><a href=”http://localhost/wordpress/members/”>Members</a></li>
<li><a href=”http://localhost/wordpress/groups/”>Groups</a></li>
<li><a href=”http://localhost/wordpress/forums/”>Discussion</a></li>
<li><a href=”http://localhost/wordpress/register/”>Register</a></li>

Here you can write <?php bloginfo(‘url’); ?> instead of http://localhost/wordpress. It will be easy when you are shifting your them from localhost to actual server. But there will be more function and database call.

<li><a href=”<?php bloginfo(‘url’); ?>/activity/”>Activity</a></li>
<li><a href=”<?php bloginfo(‘url’); ?>/members/”>Members</a></li>
<li><a href=”<?php bloginfo(‘url’); ?>/groups/”>Groups</a></li>
<li><a href=”<?php bloginfo(‘url’); ?>/forums/”>Discussion</a></li>
<li><a href=”<?php bloginfo(‘url’); ?>/register/”>Register</a></li>

Now you are almost done. Check your site.
Amazing! You should able to see all the links and buddypress pages. If you find that the pages are not quite aligned correctly, or the content is overlapping the sidebar, you will need to tweak the theme.

By default BuddyPress templates use this HTML structure:

[HEADER]

<div id=”container”>
<div id=”content”>
[PAGE CONTENT]
</div>

<div id=”sidebar”>
[SIDEBAR CONTENT]
</div>
</div>

[FOOTER]

If BuddyPress pages are not aligned correctly then you will need to modify some of the templates to match your theme’s HTML structure.

Brows your theme folder and then open up the page.php file (if this does not exist use index.php). Make note of the HTML template structure of the file, specifically the <div> tags that surround the content and sidebar, include lines like sidebars.

You will need to change the HTML structure in the BuddyPress templates that you copied into your theme to match the structure in your page.php or index.php file. The files that you need to edit are as follows (leave out any folders you have not copied over):

• /activity/index.php
• /blogs/index.php
• /forums/index.php
• /groups/index.php
• /groups/create.php
• /groups/single/home.php
• /groups/single/plugins.php
• /members/index.php
• /members/single/home.php
• /members/single/plugins.php
• /registration/register.php

Once you are done matching up the HTML structure of your theme in these template files, please take another look through your site. You should find that BuddyPress pages now fit inside the content structure of your theme.

You’re now all done with the conversion process. Your WordPress theme will now happily provide BuddyPress compatibility support.

Now if there any problem with style sheet you need to edit your style.css file.

Let me know if you find defficult to integrate. We will do it for you in a nominal price. Just drop a mail to info@studentprojects.in

There wont be any charge to give a sudgession or help. Just drop your doubts using below form. I will be happy to reply.

The post How to Integrate buddypress to wordpress theme first appeared on Student Projects.