wordpress theme wysiwyg editor default css

Many wordpress developers are creating wordpress theme. Many times when writing in editor and applying formatting. Formatting is not exactly coming in theme. we given wordpress theme wysiwyg editor default css.

Some time image alignment and photo caption is not coming properly.

wordpress theme wysiwyg editor default css

When you are creating new wordpress theme or taking theme from anyone put following CSS code in style.css file. Make sure following CSS code is present in your wordpress theme.

 /* =WordPress Core
 -------------------------------------------------------------- */
 .alignnone {
 margin: 5px 20px 20px 0;
 }

.aligncenter, div.aligncenter {
 display:block;
 margin: 5px auto 5px auto;
 }

.alignright {
 float:right;
 margin: 5px 0 20px 20px;
 }

.alignleft {
 float:left;
 margin: 5px 20px 20px 0;
 }

.aligncenter {
 display: block;
 margin: 5px auto 5px auto;
 }

a img.alignright {
 float:right;
 margin: 5px 0 20px 20px;
 }

a img.alignnone {
 margin: 5px 20px 20px 0;
 }

a img.alignleft {
 float:left;
 margin: 5px 20px 20px 0;
 }

a img.aligncenter {
 display: block;
 margin-left: auto;
 margin-right: auto
 }

.wp-caption {
 background: #fff;
 border: 1px solid #f0f0f0;
 max-width: 96%; /* Image does not overflow the content area */
 padding: 5px 3px 10px;
 text-align: center;
 }

.wp-caption.alignnone {
 margin: 5px 20px 20px 0;
 }

.wp-caption.alignleft {
 margin: 5px 20px 20px 0;
 }

.wp-caption.alignright {
 margin: 5px 0 20px 20px;
 }

.wp-caption img {
 border: 0 none;
 height: auto;
 margin:0;
 max-width: 98.5%;
 padding:0;
 width: auto;
 }

.wp-caption p.wp-caption-text {
 font-size:11px;
 line-height:17px;
 margin:0;
 padding:0 4px 5px;
 }

 

Above CSS code is very important for every wordpress theme.

wordpress-default css for wordpress theme
wordpress-default css for wordpress theme

wordpress 3.3 version is now ready for testing

WordPress 3.3 is ready for testers. Following changes has been fixed in wordpress 3.3 version.

wordpress 3.3 version is now ready for testing

  • Updated the Blue theme
  • Fixed IE7 and RTL support
  • Improved flyout menu styling and fixed several glitches
  • Finished the Pointers implementation
  • Landed the dashboard Welcome box for new installs
  • Improved contextual help styling
  • Tweaked the admin bar a little more
  • Fixed a bunch of bugs
  • Media uploader
  • Improved admin bar
  • Fly out admin menus

As always, this is software still in development and we don’t recommend that you run it on a production site — set up a test site just to play with the new version. If you break it (find a bug), please report it, and if you’re a developer, try to help us fix it.

If all goes well, we hope to release WordPress 3.3 by the end of November. The more help we get with testing and fixing bugs, the sooner we will be able to release the final version. If you want to be a beta tester,

Download 3.3 Beta 2.

wordpress-3-3
wordpress-3-3

 

How to How to remove first image from post wordpress

wordpress tutorial, remove first image from post wordpress. In many wordpress old site they used the first image as post or featured image. Here solution. while showing the single post they not want to show the first image which is uploaded.

How to remove first image from post wordpress

How to remove first image from post wordpress
How to remove first image from post wordpress

Using following code you can remove the first image from wordpress post. Please put following code in to functions.php file (you will find this file in your theme folder)


function remove_first_image ($content) {
if (!is_page() && !is_feed() && !is_feed() && !is_home()) {
$content = preg_replace("/<img[^>]+\>/i", "", $content, 1);
} return $content;
}
add_filter('the_content', 'remove_first_image');

when you see the single page of blog then you will not see the first image from blog post.

 

wordpress comment preview for box comment without plugin

Showing wordpress comment preview for comment box is always good for attracting the visitors. I shown code here for show the comments preview.

wordpress comment preview for comment box

Many times comments preview will be useful for visitors to see how comments will be looking. Using google Jquery or wordpress jquery you can add the comment preview to your wordpress blog. Showing comment preview is always good for attracting the visitors. Many clients demands for this. I shown you the example code over here for show the comments preview.

In this tutorial I am using the wordpress inbuild jquery.  First open your header. php file from your theme folder and after head tag following code.


<?php wp_enqueue_script(</code><code>'jquery'</code><code>); ?>
<?php if (is_single()) { ?>

<script type="text/javascript">

jQuery(document).ready(function(){

	jQuery("").add("<h3 id='preview-title'>Comment Preview</h3><div id='comment-preview'></div>").appendTo(document.body);
	jQuery("#comment-preview, #preview-title").insertAfter("#comment");

	var $comment = '';
	jQuery('#comment').keyup(function() {
		$comment = jQuery(this).val();
		$comment = $comment.replace(/\n\n+/g, '<br /><br />').replace(/\n/g, "<br />");
		jQuery('#comment-preview').html( $comment );
	});

});

</script>
<?php } ?>

Then Open Your style.css file from your theme folder put the following code in that file.

#comment-preview {
	border: 1px solid #ccc;
	padding: 5px 15px 15px 15px;
	}
h3#preview-title {
	margin-bottom: 5px
	}

After that upload the modified files on server. you will see following functionality for your wordpress commnets section.

wordpress comment preview for comment box
wordpress comment preview for comment box

If you are not wordpress developer then please dont try this.

WordPress has Released with server incompatibility issues

wordpress 3.0 got huge success and after that wordpress 3.2 is downloaded millions of times. This release came after some problem on many hosting company on JavaScript Modul JSon.

WordPress has Released with server incompatibility issues

As well as a few other fixes in the new dashboard design and the Twenty Eleven theme. If you’ve already updated to 3.2, then this update will be even faster than usual, thanks to the new feature in 3.2 that only updates files that have been changed, rather than replacing all the files in your installation.

WordPress has Released with server incompatibility issues
WordPress has Released with server incompatibility issues

WordPress Trac lists all the changes in the new release. If you look at the list you will notice that most are design related. Many fix or improve the Twenty Eleven default theme that ships with WordPress, while others do the same for the new admin interface introduced in WordPress 3.2.

Still no option to change the default font for the admin interface easily, unfortunately.

Updates are makinguse of the new “fast” update mechanism which only updates files that have been changed, instead of all files of a WordPress installation. Users who update via their WordPress Dashboard should notice that the procedure is speedier than before.

Updates are available via Dashboard > Updates. WordPress administrators can download the new version of WordPress from there or update directly if their blog has been configured properly for that.

increase file upload size limit in wordpress

Many times people want to upload big size media files into wordpress blog for download. Some people asked me about uploading the PDF files and video files into wordpress blog. You can easily upload big size media file to wordpress.

increase file upload size limit in wordpress

When to do wordpress installation that time default upload file limit is 2mb. Best way to increase the upload limit is adding code into .htaccess file. This file you will find in wordpress installation folder. Dont look into theme folder. Check your wordpress root folder for finding the .htaccess file.

Add following code in that file.


php_value upload_max_filesize 200M
php_value post_max_size 200M
php_value max_execution_time 2000
php_value max_input_time 2000

increase file upload size limit in wordpress
increase file upload size limit in wordpress

After this you need to add the following code in to your wp-config.php file.


<tt>define('WP_MEMORY_LIMIT', '200MB');</tt>

Increase the maximum amount of a time a PHP script will run. Note: If using a shared hosting service, you may need to ask your host to increase the limit.

For you information I am giving you the information about most popular hosting providers.

Hostgator will gives the ability to increase the limit upto only 64mb.

Bluehost will gives the ability to increase the limit upto only 96mb.

Godaddy will gives the ability to increase the limit upto only 64mb.

Mostly all shared hosting providers gives you facility to upload files upto 64mb size file. If you are having any doubts then you can write to me on wordpressapi@gmail.com.

block spam bot wordpress sites using apache

WordPress tip for security, block spam bot wordpress sites using apache. I faced a lot of issue with spam comments in my blog. Spam-bot sites will just hit. Spam-bot sites will just hit the wp-comments-post.php file and put the comments. Due to this our lot of time get wasted.

block spam bot wordpress sites using apache

Using apache setting you can protect your blog and restrict the spam bot. You need to made changes in your Virtualhost entry or you can change the .htaccess file also.

When a spam-bot comes in, it hits the file directly and usually does not leave a referrer. This allows for some nifty detection and action direct from the server. If you are not familiar with Apache directives, then write the following in your root directory .htaccess file:

RewriteEngine On
RewriteCond %{REQUEST_METHOD} POST
RewriteCond %{REQUEST_URI} .wp-comments-post\.php*
RewriteCond %{HTTP_REFERER} !.*yourdomain.com.* [OR]
RewriteCond %{HTTP_USER_AGENT} ^$
RewriteRule (.*) http://%{REMOTE_ADDR}/$ [R=301,L]
block spam bot wordpress sites using apache
block spam bot wordpress sites using apache

This will:

  1. Detect when a POST is being made
  2. Check to see if the post is on wp-comments-post.php
  3. Check if the referrer is in your domain or if no referrer
  4. Send the spam-bot BACK to its originating server’s IP address.

You just need to change the youdomain.com to your domain address.

This tutorial is written by purabtech.in. If you are having any issue then please write to me on support@purabtech.in

hide certain wordpress pages or posts from search

Some time you don’t want to come the some page and posts come in search. Here is very simple technique for excluding or removing the some wordpess pages or posts from wordpress search.

hide certain wordpress pages or posts from search

You just need to put following code in functions.php file. You will find this file in your wordpress theme folder. To work this idea you need to know about the page or post id which you want to exclude from search.

When you are creating the post that time you can get the wordpress post id Or while editing the post you will know the wordpress post or page id.


// search filter
function my_search_filter($query) {
 // make sure we are not in the admin and that we are performing a search
 if ( !$query->is_admin && $query->is_search) {
 $query->set('post__not_in', array(50, 10,32,68) ); // IDs of pages or posts
 }
 return $query;
}
add_filter( 'pre_get_posts', 'my_search_filter' );

hide certain wordpress pages or posts from search
hide certain wordpress pages or posts from search

how to install wordpress on linux web server

WordPress tutorial, how to install wordpress on linux web server. Through Cpanal or downloading the zip from wordpress site and doing normal installation. But some times If you have VPS or your own linux server then you want to know about how to do the wordpress installation easily on Linux box.

how to install wordpress on linux web server

 

how to install wordpress on linux web server
how to install wordpress on linux web server

Just follow My steps:

If you have shell access to your web server, and are comfortable using console-based tools, you may wish to download WordPress directly to your web server using wget (or lynx or another console-based web browser) if you want to avoid FTPing:

  • wget http://wordpress.org/latest.tar.gz
  • Then unzip the package using:
    tar -xzvf latest.tar.gz

The WordPress package will extract into a folder called wordpress in the same directory that you downloaded latest.tar.gz.

Then Use the following Command.

#mv WORDPRESS YOURDOMAIN NAME

Than Open your apache configuration file and put following code in that file


<VirtualHost&nbsp; *:80>

ServerAdmin support@purabtech.in

DocumentRoot /var/www/html/YOURDOMAIN NAME

ServerName example.com

ServerAlias www.example.com

ErrorLog logs/YOURDOMAIN-error_log

CustomLog logs/YOURDOMAIN-access_log custom

</VirtualHost>

Than restart the apache server.

#/etc/init.d/httpd restart

Open your site in browser and do the installtion. But dont forget to create mysql database put correct information in wp-config.php file about database and username and password.

You are ready to go with your wordpress instillation with linux command prompt. This way you can do the local installation of wordpress on linux box.

How to add content after wordpress post editor

WordPress tutorial, How to add content after wordpress post. For unique identity of your blog you need to the some common words in every posts. If you want add some default text in wordpress editor.

How to add content after wordpress post editor

you can add following code in functions.php file.


add_filter( 'default_content', 'add_subscribe_in_editor_content' );

function add_subscribe_in_editor_content( $content ) {
 $content = "If you enjoyed this post, make sure to subscribe to <a href='http://feeds2.feedburner.com/wordpressapi' target='_blank'>my rss feed</a>.";
 return $content;
}

using above code subscribe code will be added in wordpress editor.

How to add content after wordpress post editor
How to add content after wordpress post editor

Here is some very useful articles which is useful for modify the wordpress editor.

Add Buttons to WordPress wysiwyg editor

How to hide the wordpress visual editor and HTML editor

How to change the Visual Editor Font Size wordpress without plugin