Tampilkan postingan dengan label Design. Tampilkan semua postingan
Tampilkan postingan dengan label Design. Tampilkan semua postingan

Rabu, 16 Oktober 2013

Kelebihan phpDesigner 8

phpDesigner 8Kelebihan phpDesigner Editor 8 adalah PHP IDE dan PHP Editor fast built-in HTML5, CSS3 dan editor JavaScript. di tambah fitur menarik membantu dalam pembuatan website dan pembuatan template. Selain pengeditan PHP, phpDesigner 8 juga di lengkapi pengeditan HTML5, CSS3 dan JavaScript. Berikut fitur pendukung dari phpDesigner 8 :

phpDesigner 8- Fast, powerful and intuitive to use
- PHP IDE and PHP editor
- HTML5-, CSS3- and JavaScript editor
- Code insight
- Debug and profile PHP with Xdebug
- PHP frameworks
- JavaScript frameworks Integration with GIT and SVN
- Work with files over FTP/SFTP

Syntax highlighters
Code Insight helps you master PHP, HTML5, CSS3 and JavaScript on the fly.

HTML5
Built-in code completion for HTML5. It can even suggest you the missing tag.

PHP Debugging
Analyze, evaluate, profile, find errors in your PHP code line by line with Xdebug.

PHP Frameworks
Supports all frameworks for PHP e.g. Zend, CodeIgniter, Yii and Symfony.

JS Frameworks
Supports libraries like jQuery, ExtJS, Yui, Dojo. MooTools and Prototype.

Themes
Syntax themes are customizable and also comes in black variants.

Code Insight untuk PHP, HTML5, CSS3 dan JavaScript, termasuk kerangka JavaScript jQuery populer lainnya.

Intelligent syntax highlighting for PHP, HTML5, CSS3, and JavaScript
Switch automatic between highlighters for PHP, HTML5, CSS3, and JavaScript dependant on your position in your code and dim the rest of the code so you can keep a focus on your code. You can even see syntax errors as you type.

Saya Paling suka phpDesigner 8 Editor ini daripada PHP Editor yang lain. Untuk informasi lengkap phpDesigner 8 silahkan kunjungi situs resminya disini

Download

Sabtu, 12 Oktober 2013

Automatic Background Color different Every Post Blogger

Background ColorAutomatic Background Color different Every Post Blogger - Easy!! Find the code </head> then put the following Javascript code just above the </head>

Background Color

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js?ver=1.5' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
function get_random_color() {
var letters = '0123456789ABCDEF'.split('');
var color = '#';
for (var i = 0; i < 6; i++ ) {
color += letters[Math.round(Math.random() * 14)];
}
return color;
}
$(function() {
$(".post").each(function() {
$(this).css("background-color", get_random_color());
});
});
//]]>
</script>

If you just want to change the color of posts on the main page alone you stay just use conditional tags like the code below:

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js?ver=1.5' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
function get_random_color() {
var letters = '0123456789ABCDEF'.split('');
var color = '#';
for (var i = 0; i < 6; i++ ) {
color += letters[Math.round(Math.random() * 14)];
}
return color;
}
$(function() {
$(".post").each(function() {
$(this).css("background-color", get_random_color());
});
});
//]]>
</script>
</b:if>

Display different colors on the background of each posting may be ideal only for Templates with Style Gallery. But there is no harm if you want to try.

How to Add the Twitter Share Button to Your Blogger Posts

ShareHow to Add the Twitter Share Button to Your Blogger Posts - Twitter has recently officially released its new Sharing Button with optional counter (Tweet Button). The button comes in three styles and features a new URL shortener. The Tweet Button will show how many times your post has been shared on Twitter.

The main advantage of the Tweet Button is that it enables the reader to follow you (and a related account) after he tweets your post. If you have a WordPress blog, please use the WordPress Tweet Button Plugin

To add the new Tweet Button to your Blogger blog, follow these simple steps:
  1. Login to your Blogger Dashboard and Navigate to Design Edit HTML
  2. Click on the Check box which says Expand Widget Templates
  3. Now look for (Ctrl + F)

<data:post.body/>

and immediately above it paste the following code snippet (after proper editing)

<div style="float:left;padding:4px;">
<a href='http://twitter.com/share' rel='nofollow' class='twitter-share-button' expr:data-url='data:post.url' expr:data-text='data:post.title' data-related='metropersonal:Tips and Tricks for Blogger' data-count='vertical' data-via='' data-lang='en'>Tweet</a>
<b:if cond='data:post.isFirstPost'>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js">
</script>
</b:if>
</div>

4. Save your template.
5. Now you should see the Twitter button somewhere near your blog posts.

Editable parameters

  • Float:left - you can change this to float:right if you need the button on the right side of the post instead of on the left.
  • data-count='vertical' - you can change this to data-count='horizontal' or data-count='none'
  • data-via='' - you can edit it with your Twitter username. So if your Twitter name happens to be tom, then change it to data-via='tom'
  • Adding some extra text in the tweet � With the current code, the button will make a tweet with the title of the blog post. If you want to add some extra text to the tweet, change expr:data-text='data:post.title' to expr:data-text='&quot;I am Reading: &quot;+data:post.title' This will append "I am Reading:" to the tweet
  • Recommend another Twitter user - data-related='metropersonal: Tips and Tricks for Blogger' here metropersonal can be replaced with the twitter username that you want to recommend (don't use @) and you can replace Tips and Tricks for Blogger with the a short description of the related account.
  • Change language � you can change data-lang='en' to data-lang='fr' or data-lang='de' or data-lang='es' or data-lang='ja' (en, fr, de, es and ja stand for English, French, German, Spanish, Indonesia and Japanese respectively) Displaying the Tweet Button on Post Pages Only If you want to display the Twitter button on posts page only, then wrap the code with conditional tags like (wrapping tags in green)

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style="float:left;padding:4px;">
<a href='http://twitter.com/share' rel='nofollow' class='twitter-share-button' expr:data-url='data:post.url' expr:data-text='data:post.title' data-related='bloggerplugins:Tutorials and Widgets for Blogger' data-count='vertical' data-lang='en' data-via=''>Tweet</a>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js">
</script>
</div>
</b:if>

Demos

1.data-count='vertical'
2.data-count='horizontal'
3.data-count='none'

If you want to display a simple Text link instead of the Button, pleease read my article Simple "Tweet This" Text Link for Blogger.

More Info about the Tweet Button

<iframe width="360" height="360" src="http://www.youtube.com/embed/LB0hrJ_ZZzc?feature=player_embedded" frameborder="0" allowfullscreen></iframe>