Tagged with " WordPress"
Jan 15, 2009 - PHP, Wordpress    31 Comments

WordPress: adding a custom option box and developing file upload plugin

Hello Buddy,

One of my clients wanted to show thumbnail photo beside the post text as below. So, I had to make a plugin so that the admin can post the thumbnail when he is writing the post or can edit when editing the post. Take a look at the thumbnail’s position below.

Thus, recently I solved a plugin problem in one of my wordpress works although it was small. You know you may sometimes need to add a custom field in your wordpress posting/writing/editing area. To check what I am saying, take a look at the following image:

Adding such a box is extremely easy using the wordpress’s builtin add_meta function. But does file upload works i.e. if you upload the file, will it work? The answer is straight – “NO”. But why? The reason is also simple. If you want to upload a file, your form should have “enctype=”multipart/form-data” in the form opening such as

But the problem is – if you open the source code of text editor tool as following,

you will see that it does not have “enctype=”multipart/form-data” unfortunately. It looks exactly like this in my wordpress 2.7 version if I open the wp-admin/edit-form-advanced.php file at line # 520.

Not funny? Huh?

So, to cope up with this situation, I had to add “enctype=”multipart/form-data” in the form although I do not like changing the core files. Why do not I like to change the core files? The answer simple. Because whenever there is an update, the client have to update the file everytime. The client may not like it or may even forget it. Anyway, after change, it looks like this:

OK. Lemme show you step by step what to do if you want to add a file upload plugin.

Step One: Change the “wp-admin/edit-form-advanced.php” file

Open this file from the mentioned location and change the following line in the file:

to this line:

Step Two: Write you plugin

Here goes mine:

Please notice that I dynamically delete any unnecessary file using the PHP’s unlink() function.

Step Three: get your image name from the database

I have placed the following code in my functions.php file.

Step Four: Link with the index.php or single.php or wherever you want

See how I placed the thumbnail image source in the code of index.php and single.php file.

Step Five: Test

Now you need to test and we are done!

You can also download my little plugin if you want from here:
http://www.tanzilo.com/demo/code/bag-thumb/bag-thumb.zip

Thank you for reading.

Jan 6, 2009 - PHP, Wordpress    12 Comments

WordPress: display posts by category ID. Solution with code & example.

Hello Guy!

Often in many blogging sites, you will see two or three columns of the most important categories. Recently I had to do this for a blog. It was a little bit cumbersome and time consuming. So, I would like to share the solution so that you can kill the time waste trying yourself in case you do not know how to do it. In this solution, I show 5 posts at maximum from my chosen three categories.

OK.
Let us start and let me show how to do it.

Step One: See the sample what would be the output

In the above image, you will notice that the first category has enough posts, so it can fetch 5 (five) posts for us. But in second column and third column, there are only three posts because those categories do not have more than three posts. And what I want to say at this point is – although we will try to get 5 posts from each category, we will not get enough in case that category has less than 5 (five) posts and this is done automatically.

Step Two: Adding custom function

Now open the functions.php file inside your theme directory and insert these two functions. If there is none, create a functions.php file. And at this point, please remember that all the functions and coding in this file are automatically added during the code execution.

Note that the function names are self descriptive.

Step Three: Embed code in your file(s)

Now open your footer.php file or any other file and add this code. In 99% cases, you may need to customize this small piece of code. The first three lines are category IDs.

Step Four: Link your CSS code

I have put the above CSS code in my style.css file. In 99% cases, you may need to customize according to your requirements.

Step Five: Test everything by opening the link

Now test you code and we are done!

Thank you for reading.

Dec 19, 2008 - PHP, Wordpress    45 Comments

WordPress: get page id and content with example & code

Hey Guys!

Often I see people coming to my site searching with the terms wordpress get page id, wordpress get page content or something similar. I think wordpress developers face situations when they need to get page or post information in customized way. It happened to me too and I would like to share it with others since often people are coming to search this information.

Well. It is very easy and we can solve it quickly.
OK. Now let me show you how to get these information.

Remember one thing that is important for wordpress data fetching of this kind. Your posts and pages information is saved in a single database table and that is wp_posts. The wp_ is the prefix of you database and may differ. But most of the times the database table name is wp_posts and other times it is YourCustomPrefix_posts. We are going to fetch data from this table.

WordPress – print page id:

There is a built-in wordpress function using which you can print the post or page id. When you call this, this directly prints this inforation in your page without the need to use the built-in PHP echo or print function. Remember to keep it in the while loop.

WordPress – get page id:

There is a global variable post which contains the related information of the currest post or page. The name of the variable is: $post and it is actually an object. You can access information just as you access variables from an object. Remember to keep it in the while loop.

You can print all the information in the $post object to see all the variables and their values that is contains.

WordPress – get page content:

Now you know you can get the page or post content from $post->post_content variable. But if you echo or print them, they may look somewhat without formatting. So, you need to use PHP built-in nl2br() function to look the content as it is.

WordPress – get any information of your page or post:

You know you can print all information to check all the available variables and their values through using PHP’s built-in var_dump() function. Suppose you need to get the post title, post type and posting time. We can get them easily in this way.

Please notice that post_title, post_type and post_date are all several database fields from wp_posts table of our wordpress database.

Very easy. Right? And that is all for getting the page or post information.

Thank you for reading.

Dec 17, 2008 - PHP, Wordpress    11 Comments

WordPress: Custom URL rewrite and reading URL values

Hello!

Recently I was working for a Irish guy who has opened a wordpress blog few months ago. I did the theme for him. Recently he requested me for modifying and/or upgrading the project. One of the project requirements was URL rewriting. For example, there can a URL as follows:
http://www.sitename.com/index.php?group_name=My-Input-Value-Goes-Here

But after rewrite, the URL should look like:
http://www.sitename.com/My-Input-Value-Goes-Here

Well. You see I am passing the variable value in index.php file. But I needed to read the custom URL passed value through another PHP file and that is group.php. My group.php file was inside the theme folder. I am passing the group_name value in index.php file but reading from group.php file. It sounds a bit interesting. Huh?

OK. After browsing several blogs, I came up to writing a custom plugin. Thanks to Google.com and all those people sharing information.

My plugin made me a way so that I could pass a variable value in index.php file but read it from group.php file. This plugin code is available almost everywhere. Here goes my plugin:

So, what happens now when I activate this plugin? It does a simple work and that is: when it gets a link as below:
http://www.sitename.com/index.php?group_name=My-Input-Value-Goes-Here

It sends the group_name variable value to group.php file which is in the theme folder. In group.php file, I can catch the variable value and use it anyway I want.

Do you want to see my group.php file too? OK. Here it goes:

This was half the way winning the battle.

But why? Because the following lines should solve my problem.

But for any unknown reason it was not working.

So, I had to take help of apache (dot)htaccess file for solving the rest of the part.

I was searching for a helpful blog link and after searching many blogs, I found a similar blog article and here it is:

http://www.webmasterworld.com/forum92/6079.htm

In this blog, I found a similar solution and wrote my own based on this code.

Finally my (dot)htaccess file looked like this:

But I was not 100% perfect but close to the solution. The reason is my URL started looking like this:
http://www.sitename.com/pages/My-Input-Value-Goes-Here

Well. You see I was almost close to the solution. As the buyer wanted like this:
http://www.sitename.com/My-Input-Value-Goes-Here

But I came up with a solution to:
http://www.sitename.com/pages/My-Input-Value-Goes-Here

I believe you can work on it and come to a solution without the extra “pages/” part in the URL. If you find such a solution, please share with me and others who will face similar problem.

Dude! That is all for now.

Thank you for reading.

Dec 15, 2008 - PHP, Wordpress    2 Comments

WordPress: Upload many PHP files quickly by Zip & Unzip

Hello!

It is actually not only for a wordpress developer but also for all those developers who face situation where they must upload many files to the server. Recently in a wordpress project, I had to upload wordpress 2.7 version files in the server. In the wordpress 2.7 package, you will find around 600 files! Uploading them is not very interesting when your internet connection do not guarantee you smooth upload.

Uploading the 600 files brought me pain because they were going to the server very slowly and each time some files were corrupted and for any reason reuploading the corrupted files were not working. It was really time consuming, boring and painful. Then I started to look for an alternative solution. Then, I naturally came to the idea that how about I zip (compress) the folders containing most of the files and upload them. Thus I have to upload few zip files although bigger in size. Writing a piece of PHP code to unzip the zipped file is easy too.

So, I decided to zip the main three folders and uploaded them. You know they contain most of the files.

OK. Let me tell you the process in step by step way so that you can follow easily:

  1. First I zipped my three folders (wp-admin, wp-content & wp-includes) that contains most of the files.
  2. Changed the ‘public_html‘ folder permission to 777. Remember you will do it for the folder where you are going to upload.
  3. Uploaded the three zipped folders.
  4. Run my PHP script that you will see below.
  5. Checked if everything is OK and found them OK.
  6. Changed the file permission of the ‘public_html‘ folder back to 750. If you uploaded to any other folder, you need to change the permission 777 to any combination you think good for your purpose.
  7. Deleted the zip files since they are no longer required.

Here goes my PHP code to unzip them and it is very simple!

By the way, you can improve the code to more sophisticated one as per your requirement. For example, the exec() function has several options that you can use for more flexibility or anyway anything else you want.

Oh! There is one other way to unzip a uploaded zipped file although I did not use this piece of code. But remember that if you use this code you need to set your destination file permission to ‘777’ first and then change as mentioned before after you unzipped. Fortunately this coding is very simple too and an example is as follows:

I tested both the processes mentioned above in Linux system and not sure how it works in Windows Server. I guess the second process should work in Windows server for uploading and unzipping bulk file quickly.

This is all for the trick of the game and for killing the pain of uploading several hundred of files.

Well. You can download my little sweet code here too:
http://www.tanzilo.com/demo/code/unzip/unzipping.zip

Thank you for reading.

Nov 28, 2008 - PHP, Wordpress    3 Comments

WordPress: Creating a Static Front/Home Page without Plugin

Hello WordPress Developer!

When I was new to wordpress blog devevelopment, I got few projects where the clients wanted a static homepage and a Blog link in the menu. In some other projects, the clients wanted to make the homepage to be semi dynamic; that means in the homepage we will show some wordpress data like three latest posts and other things will be static.

You know when we install WordPress the homepage is by default going to show the latest 10 blog entries. But now the homepage will be static, semi dynamic or anything. We will create a page and link it to default WordPress homepage.

OK. Take a look below of what I mean.

I tried it several ways. But I was not satisfied the available solutions. But luckily I figured out a stable solution. My solution does not need any plugin and it is simple too.

Step One: Create your custom homepage

First of all create your homepage as static, dynamic or whatever you want name it as home.php and remember that when visitors come to your site, they will see this file running as front page or website homepage. Upload it in the theme directory.

Step Two: Create your blog homepage templae

Create your blog homepage template and name it blog.php or anything. For clarity and relevance, let us name it blog.php and upload it in the theme directory.

Here is the code:

Step Three: Create your blog homepage

Now create your blog homepage index and name it as index.php and then upload it in the theme folder.

Here is a sample of blog index.php file code:

Step Four: Create a page as Blog from admin panel

Now log in to the admin panel and create a page named as Blog. See the image below what I mean:

Do not save or publish this page right now. Follow the Step Five below before you save or publish this page.

Step Five: Set the blog page template

Now go to the Advanced Options section at the bottom. Under Page Template, select Blog template for this page.

Take a look of what I mean:

Now publish your page!

Now you may ask how this Blog template is coming? It is coming because of Step Two and of the first 5 (five) lines as below:

Step Six: Check your site

Now go to your site and check everything! We are done!

I must say a big thanks to my American friend Joshua Knowles for his contribution to find out this smooth technique. Although Joshua is not a regular developer, he is a brilliant guy indeed!

Thank you for reading.

Nov 23, 2008 - PHP, Wordpress    6 Comments

Flickr Gallery in WordPress: Integration with FAlbum plugin

Hello!

Recently I added a gallery in wordpress blog that displays photos from a wordpress plugin FAlbum. This plugin is very nice one and works very smoothly with wordpress. Installing and configuring it with wordpress is somewhat tricky and time consuming. Once you set it up, it will be your great tool.

OK. Now let me share my experience in setting up, configuring and integrating the FAlbum Flickr plugin with wordpress blog.

Integrating a small gallery in wordpress

Before we start, please take a look at what we are going to do. Check the following link.

Click here to see a small gallery with 6 photos at the bottom of the page.

Step One: Download and install the FAlbum plugin

First of all, download the FAlubum plugin from the following link:
http://www.randombyte.net/blog/projects/falbum/

Now unzip the file and make sure that you unzip the file in a folder named as falbum. A common error is unzipping the files in a folder named as FAlbum-0.7.1 and uploading it in the plugins folder of wordpress. Make sure that your files are located as follows:

instllation_directory/wp-content/plugins/falbum/falbum.php
instllation_directory/wp-content/plugins/falbum/FAlbum.class.php
instllation_directory/wp-content/plugins/falbum/wordpress-falbum-plugin.php etc

Step Two: Activate the FAlbum plugin

Log in as admin in your wordpress system and activate FAlbum under the Plugins tab.

Step Three: Configure and setup the FAlbum

Now from the Settings tab, go to FAlbum tab as like Settings –> FAlbum.

Here you will find two steps, complete both of them.

Step Four: Set the options and the (dot)htaccess file

Next, you come to FAlbum Options. Now set there everything as per your preference. Remember one important thing. It is about your (dot)htaccess file. If it is not writable, make it writable. Otherwise, you will get a message that your (dot)htaccess file is not writable and the plugin will request you to copy and past some code. Do either way you like.

Just for your information, I am using the the default settings without change any of them.

Step Five: include and add album code in your theme file

I am showing 6 (six) Flickr photo files at the bottom. So I have add the following code in my footer.php file.

In my footer.php file code, I placed in a DIV element. So, it looks somewhat like this:

Step Six: creating falbum.php file from index.php file

Now we will go to our theme directory. Here you see several files like index.php, header.php, footer.php etc. Now copy the index.php file and paste it as falbum.php. Open the falbum.php file and add FAlbum code and a sample is as follows.

Upload this new falbum.php file to your theme directory in the server.

Please remember that there are two different falbum.php files in two different locations. So, pleaes do not confuse with one another.

instllation_directory/wp-content/plugins/falbum/falbum.php
instllation_directory/wp-content/themes/theme_name/falbum.php

We have created the second one from our theme’s index.php file.

Step Seven: Check the output

Go to your website, refresh it twice and click on the thumbnail of any flirkr image.

So, you are done. Huh?

Integrating a complete gallery in wordpress

Well. You may want to keep a single page as your album home and in that page you may want to keep some Flirkr photos in thumbnail so that it looks gallery homepage. Fine!

Now let us see how we can do this.

Step One: Read the above part “Integrating a small gallery in wordpress”

Check the above part thoroughly since you will need the knowledge from the above part titled as Integrating a small gallery in wordpress. Since many things are common, I have avoid the repeated description.

Step Two: create a file and link it to wordpress

First of all, create a file and link it with wordpress. You can follow my another article to do this. The another article is here:

http://www.tanzilo.com/2008/11/02/wordpress-how-to-add-and-link-static-or-custom-pages/

Step Three: add the album code to your page

You can add photos in several ways. For example, if you want to add latest or recent 8 photos, add the following code.

If you want to show 8 random Flickr photos, add code like this:

You will find more details on how to customize your page in the following link:
http://www.randombyte.net/wiki/falbum/functions_and_variables

Step Four: Customize CSS coding for custom look

Remember that each thumbnail photo will be placed in a list element. So, if this is the PHP code where we place the album:

Here is the CSS to make them looking like a thumbnail gallery:

Next, the bigger photo and all other things like next, previous buttons and tags etc will be displayed in a DIV element named as content.

Step Five: Check your site

Now you are done! Go to your site, refresh the site twice and check you album.

So, we are done!

These following two links will be helpful and you can visit them for more information:
http://www.randombyte.net/wiki/falbum/functions_and_variables
http://www.randombyte.net/wiki/falbum/incorporating_falbum_into_your_own_theme

Thank you for reading.

Nov 2, 2008 - PHP, Wordpress    14 Comments

WordPress: How to add and link static or custom pages

When I was new to wordpress theme development, I faced a common problem that many others might have faced. That is adding or linking or integrating a static or custom page in your wordpress site. It is very possible that you may prefer to keep one of your page or file linked as the following:

http://www.yoursitename.com/products.php

Sometimes this kind of requirement arrive that you have no other option but to do it.

But you know this kind of link will not directly appear in your wordpress blog or site because of the unique linking structure of wordpress. Most probably you will get a 404 error i.e. file not found error. So, if you want to link directly, you need to follow a simple trick. This trick is simple, small and intereting.

If you want to add and link your custom or static pages, follow these steps and you will get smooth result:

Step One: Changing the header of the php file

In this article, we will add a php file products.php in our wordpress blog. So, please create your products.php file.  Now open you products.php file and add the following two lines at the top of the file and save your file.

Remember, these lines will be the topmost lines in your products.php file. OK? See below how I added.

Why are we adding these two lines? Because we are telling wordpress that this file will not use wordpress themes and we are going to link it in a different way. So, wordpress do not force to link in its usual way.

Step Two: Saving in the public_html or root folder

Now upload it in the wordpress installation directory so that it looks like:

http://www.yoursitename.com/products.php

Done? Great!

Step Three: Linking the products.php file in a usual way

Now in the code of any wordpress file where you want to link your products.php file, keep the html linking as usual or what we say relative linking. For example, in the contact us page, I am creating such a link in the body section:

And yes! We are done!
Test now if it works for you.

Thus, you can add any number of pages in your wordperss site. I do not know exactly when you may need to link this way. I had to do it time to time depending on the client’s project requirement.

Thus, you can also protect your pages from permalink (dot)htaccess in wordpress.

Thanks for reading.

Nov 1, 2008 - PHP, Wordpress    48 Comments

WordPress: get page content by page id. Static pages to Dynamic

Hello!

Recently I am working in a wordpress project where I am converting a total static site to wordpress site. What I do is: (1) from the static pages, I am taking the static text and creating a new wordpress page for each static page. (2) fetching the page content/text by page id and (3) showing them wherever I want.

I have written a function and now I can fetch the content of any page or one more pages just by the page id.

I am using this function to fetch several page data and show them in one page. In the static site, there are several section with different designs. The client want edit each section using wordpress. So, if there are three different sections, I am creating three individual pages for this single page. Next, I am just fetching the content of the three pages by calling my method three times with different parameters and showing the output in one page.

For exampe,

Thus, I am just shifting all text and/or content of the static site to wordpress so that the client can edit the site himself. I think this is a simple way or technique if you want to convert your static page to dynamic wordpress site.

You can also customize this one as per your need. For example, you may only need to fetch the page title.

You can not only get the page content, but also the post content if you set the value of the “$pageId” equals any post id. You know you can see the page or post id from the admin panel.

By the way,
I have put my functions in the functions.php file so that I can access it from anywhere. I suggest you following the same way i.e. writing all your custom functions in the functions.php file.

Thank you for reading.

Oct 18, 2008 - Wordpress    42 Comments

Password protect sub-directory in wordpress by htaccess

Hello!

Recently a Canadian client of mine told me to look at an interesting wordpress problem. I regularly develop wordpress theme for him. He is a great artisitic designer of wordpress theme and I code theme to HTML & CSS. Whatever, my client told me that he wants to password protect a sub-directory “download”. He has done it from cPanel. He also created a user and permitted that user in that sub-directory. But it was not working.

Befoer I start, I want to clear that in this case wordpress was installed in root directory. One more thing is in this post i cannot write “.” and “htaccess” together. May be this is a security issue. If I write “.” and “htaccess” together, the post is not saved and I get a 404 error. So, I have written (dot)htaccess instead. Again, (dot)htpasswds instead of “.” and “htpasswds” together.

So I logged in to the cPanel to check what is happening actually. I found that whenever you password protect a sub-directory from cPanel, a new (dot)htaccess file will be created in that sub-directory. And the content of the (dot)htaccess file is less or more like as follows:

And your password that you set from the cPanel will be encrypted and saved in a file (dot)htpasswds in the AuthUserFile location.

If this was not a wordpress site or it was a wordpress site (but custom Permalink not used; rather the Default used), you should not face problem in most cases. But when you use customized Permalink in wordpress to create beautiful links and try to protect a password, the password protection from cPanel does not work!

But do you know why? Here is the reason: in the root directory you installed wordpress and here there is a (dot)htaccess file. The settings in this file and the (dot)htaccess in your sub-directory (for example root_directory/download/(dot)htaccess) do not smoothly match with each other with since you are using Permalink plug-in to customize your URLs.

So, when you try to go to: http://www.yoursitename.com/download wordpress think that it is a post or page!

WordPress think this because you have enables permalink and this is quite correct and logical. But you know your download sub-directory is not a post but a folder/directory in the root folder. So, you need to do something so that wordpress does not confuse the following link as a post or page.
http://www.yoursitename.com/download

Here is the solution:
1. Open the (dot)htaccess file in http://www.yoursitename.com/(dot)htaccess
2. Find out the line # BEGIN WordPress
3. Just before this, add the following three lines:

4. Save the (dot)htaccess file and upload in your root or installation directory.

Now go to http://www.yoursitename.com/download and check if it works. If everything is OK, you should get a prompt asking for a username and password that you set from the cPanel.

Here is my example:
Sub-directory download password protected: http://www.tanzilo.com/download
Permalink smoothly working: http://www.tanzilo.com/2008/10/18/password-protect-sub-directory-in-wordpress-by-htaccess/

Or you may install a shopping cart in location as in:
http://www.yoursitename.com/shop

This should work smoothly too as you see my example here:
http://tanzilo.com/shop

Although there is an application/software in the shop sub-directory, wordpress no more thinks it a post or page!

Thus, you can set (dot)htaccess, password protected sub-directory (i.e. /download/) and any other sub-directory (i.e. /shop/) in such a way that they will be living in happiness in the same home!

The last interesting thing is this solution is sometimes helpful in Drupal and in some other applications where (dot)htaccess and URL rewriting code do not fit together.

Thanks for reading.