Create tabs for Blogger using jquery and id tabs

If the space of your web page is limited and you want to show more content ,what do you do ? In this case ,organizing content as tabs is a good solution . You can see a live demo in recent comment and recent posts section in my blog.

I found a plugin of Jquery named idTabs . With this script ,creating tabs is very simple . In addition ,this plugin has a lot of options for appearance of tabs . This is really awesome tabbing scripts.
to create tabs view with idTabs and Jquery,follow these steps :
1, idTabs is a plugin of Jquery framework ,so it can't work if Jquery is not installed in your web page . Jquery can be found here . Download Jquery and upload it to a host .
In your blogger template ,insert this line after ]]></b:skin>

<script type="text/javascript" src="url..../jquery.js"></script>

remember to change the url of jquery.js to the right
2,Download idTabs script at here . Upload it to a host and paste following line after the line above :

<script type="text/javascript" src="url/jquery.idTabs.min.js"></script>

remember to change the url of jquery.idTabs.min.js to the right
3, To add tabs view to your blogger , open your template in edit HTML mode ,choose where to add tabs and write code as this structure :
<ul class="idTabs">
<li><a href="#tab1">tab 1</a></li>
<li><a href="#tab2">tab 2</a></li>
</ul>
<div id="tab1">content of tab 1</div>
<div id="tab2">content of tab 2</div>

In this structure, any <a href="#tab"> inside of an element with class="idTabs" will show the element with id="tab" .
In this steps ,if you don't want to edit in HTML mode ,you can add a HTML/Javascript widget and paste the code above into widget content.

4, Ok,save template and you are done .

5,If you want to know more about idTabs and other options for tabs view ,you can go to this website . There are some interesting things you can do with this script ,and I hope it is the script you need .

Top 5 serif fonts for designers

This list is from Woorkup blog . I hope this will be helpful for you - designers .
Here is the list :

Harabara

Puritan

Resavska

Roadway

Oceania

my experience with Paypal for getting money back after got scammed by seller

Have you ever use Paypal for making payment ?
Have you ever scammed via Paypal ?
Have you ever win a dispute in Paypal but you can't get money back because the seller take money from his paypal account and go away ?
I was in this situation two times ,and I took my money back in both .
I know many peoples who suffered the feeling of losing money when he /she got scammed via Paypal . And most of them avoid using Paypal for the buying in internet for the next time . Is it worth for doing that ?
here is my experience when got scammed , I hope this story will be helpful to you ,my friend ,who want to use paypal as payment method .

The first time I sent $250 to a seller in china via ioffer.com website ,transactions was made outside ebay ,so paypal buyer protection policy doesn't work in this case . She sent me a cheap ring instead of a cellphone which I bought . She even added EMS shipping tracking number to paypal . I took photos of the ring I received ,scan shipping bill , and sent all these to this email address : apaccrme@paypal.com ( this is email of anti fraud department in paypal ) . After checking all document I sent , Paypal made a refund for me . It had been 10 days since we made transaction but Paypal still made refund to me .

The second time , I sent $400 to a seller in Australia for buying an iphone . After payment made ,the seller informed me that he sent me the good via Fedex and it would take 7days for arriving ,and he never answered any mail of me later . 7days ,I still got nothing . I opened a disputation in paypal ,they said after 15days without response from seller ,they would decide this case as my favor . After 15 days ,they said me this disputation was decided as my favor and I won in this case ,but seller withdrew money from his account so I got nothing back . I was angry . But I had a trick . I used another email address and mail to this seller for asking about his iphone and want to buy one for my self . He thought me another victim ,so replied me immediately . In mails ,I said I want to know about himself and his paypal address . He answered me that he is legit seller and give me his paypal mail address . His paypal's email when he replied me was changed ,it mean he created another paypal account for scamming . I forwarded all mails I received from this seller to apaccrme@paypal.com and noted that this seller is obviously scammer and I showed that he change his paypal account for scamming. After receiving my mail ,2 hours later ,I got an email from paypal said that base on my emails ,they decided to send money back to me from their fund and they would find the scammer-seller for take money back with the help of police . I got $400 back to my paypal account .

Here are my notices for when using paypal :
1,Try to collect emails address of paypal's departments and mail to them all when you are scammed . In general ,I mailed to all of paypal departments but only apaccrme@paypal.com is responsible for solving my trouble . Ms Selina at apaccrme@paypal.com is very honest and friendly . She's there to hear you .
2, Whatever you say will be nothing if you can't prove or showing any proofs . A shipping bill ,photos of good you receive,emails... are solid proofs for you .
3, In a disputation , you get only 50% to take money back ,if you are unlucky ,you will lose money . So mail to them immediately when you think you are scammed and mail as many as possible .
4, Be patient and friendly , don't mail to paypal with your angry words . In many payment processes I used ,paypal's support is the fastest and honest .

I hope my story is a good example for you if you got scammed . Thanks for reading

Erotic body-painting. Jon Planas.

The art-work of American artist Jon Planas. Public painting on the nude model.













































































Website: http://www.creativewebworks.com/Planet%20Planas%20Website/html/main.htm

The erotic photo-art. Paul Freeman.

The art-works of Australian photographer Paul Freeman. Emotional photos of beautiful nude men.







































































































Website: http://www.paulfreeman.com.au/

Make a navigation bar with automatic highlight current links

here is the image of navigation bar in my blog :



to make a navigation bar with automatic highlight current links ,there are a lot of tutorials in internet ,they can use CSS ,PHP or Javascript for making .
In this post ,I will tell you the way I did in Blogger . Blogger has some its own functions and statements , base on them ,you can make a navigation bar for your site ,easy and simple .
At first , I will explain the idea come with making this navigation bar in blogger ,after that ,I will show you step by step .
In blogger ,there are a widget called Linklist ,you can find this widget in widget list . This widget is a default widget of blogger ,and it help you create a link list in your blog ( or Blogroll as usual) .You add it to your blog and create a link list and then we convert this link list to a navigation bar by using CSS . After that ,we add some javascript to highlight current link . This script will get url of the current page which is being opened in browser and check it with links in link list . If url of current page and link in link list are the same , it will highlight the link in navigation bar .
Clear ?
let's start .

1,Go to your blogger account . Login . Go to Layout --->Page elements .

2,In page elements ,you can add a widget to where you want by click on Add a widget

In the list of widgets ,choose Linklist :


3,Giving basic style to the navigation .
All link list widget is under class .Linklist . So ,to styling the link list and make it look like a navigation bar , you need to giving some CSS to class .Linklist .Like this :

.Linklist {

float:left;
background:#fff;
color:#000;

border:1px solid #ddd;
height:30px;

width:980px;

}
.Linklist ul,li

{

list-style-image:none;

list-style-position:outside;

list-style-type:none;

}

.Linklist li {

border-right:1px solid #DDDDDD;

float:left;

height:30px;

line-height:30px;

padding:0 10px;

}

.current-cat {

background:#ddd none repeat scroll 0 0;

}

4,Add this code after ]]></b:skin> :

<script type='text/javascript'>
function currentpage (url,current,name) {
var name = name ;
var url = url;
var current = current;
if (current == url) {
document.write (&#39;&lt;li class=&quot;current-cat&quot;&gt;&lt;a href=&quot;&#39;+url+&#39;&quot;&gt;&#39;+name+&#39;&lt;/a&gt;&lt;/li&gt;&#39;);
}
else {
document.write (&#39;&lt;li&gt;&lt;a href=&quot;&#39;+url+&#39;&quot;&gt;&#39;+name+&#39;&lt;/a&gt;&lt;/li&gt;&#39;);
}
}
</script>

5,Go to layout ,continue to edit HTML . Check expand widget templates ,and search for this code :
<b:widget id='LinkList1' locked='false' title='' type='LinkList'>
<b:includable id='main'>

<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content'>
<ul>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target'><data:link.name/></a></li>
</b:loop>
</ul>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

and replace for the following code :

<b:widget id='LinkList1' locked='false' title='' type='LinkList'>
<b:includable id='main'>
<ul>
<b:loop values='data:links' var='link'>
<script type='text/javascript'> currentpage(&quot;<data:link.target/>&quot;,&quot;<data:blog.url/>&quot;,&quot;<data:link.name/>&quot;); </script>

</b:loop>
</ul>
</b:includable>
</b:widget>

Save template . Ok ,you are done

How to add link to page navigation :
In Page elements , Click on edit link in Linklist widget


add your link url at New Site URL and title for it at New Site Name

A little note for adding link to a label page in this page navigation :
Link to page of a specific label is like this :
http://....../search/label/labelname
when you add link ,in New Site URL box , do not include slash at the end of label's page link :
it is : http://....../search/label/labelname
Not : http://....../search/label/labelname/
because if a label page is being opened ,its current url is only
http://....../search/label/labelname
so if you enter this link to New site URL box :
http://....../search/label/labelname/
this two links are not the same when compare ,so current page link in page navigation can't be highlighted .

SimplexPro - maximize your adsense earning

In my templates before ,many people asked me for adding widgets to their template . Because of widget is an important part of Blogger and help people can add what they need to template ,so in this template ,I made this template fully widgetized . You now get 4 place for adsense .

Download |You can see the demo at SimplexDesign blog .

Install instruction

1.Download this template . Unzip it . You will get a template file in xml format and a folder for images .
2.Upload all images to a hosting service like photobucket .
3.Open the template file ,change all link of images in CSS section to your images link.
4.Change all link of my blog : http://simplexdesign.blogspot.com to your blog link .
I suggest using Notepad++ for editing template and finding links to change . It's easier than using Blogger editor .
5. The code of top navigation bar here :
<!--top navigation bar-->
<div class='headline'>
<strong class='fl'><a href="#">About me</a></strong>
</div>
<div class='headline'>
<strong class='fl'><a href="#">Contact</a></strong>
</div>
<div class='headline'>
<strong class='fl'><a href="#">Link Exchange</a></strong>
</div>
and edit them accordingly .
6.Find this code
<div class='subcribe_box'>
<a href='http://feeds.feedburner.com/Simplex'>
<img src='http://i604.photobucket.com/albums/tt130/metalner/Newspaper_Feed_add_128x128.png'/>
</a>



<form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=Simplex&amp;loc=en_US&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' style='margin: -5px 0pt 0pt; padding: 0px; text-align: center;' target='popupwindow'>

<h2>Subscribe to SimplexDesign</h2>
<p> Receive New Articles As They are Posted</p>
<div style='float: left; padding-left: 10px;'>
<input name='email' style='padding: 2px 5px; width: 200px;' type='text'/>
<input name='uri' type='hidden' value='Simplex'/>
<input name='loc' type='hidden' value='en_US'/>
<input type='submit' value='Go'/>
</div>

<div style='clear: both; height: 5px;'/>
</form>
</div>
and replace link of feed to your blog feed link .
7. Link of Twitter :
<div class='follow_me'>
<a href='http://twitter.com/dinhquanghuy'>
<img src='http://i604.photobucket.com/albums/tt130/metalner/follow-me-500.png' width='250'/>
</a>
</div>
change it to yours .
8.Code of recent posts and recent comments :
<div id='tabs2'>
<ul>
<script src='http://simplexdesign.blogspot.com/feeds/posts/default?max-results=5&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts1'>
</script>
</ul>
</div>
<div id='tabs1'>
<ul>

<script src="http://simplexdesign.blogspot.com/feeds/comments/default?alt=json-in-script&amp;callback=showrecentcomments">
</script>
</ul>
</div>

Change http://simplexdesign.blogspot.com to your blog link .Save template and upload it to blogger .
9. Go to Layout ,click on Page elements tab .


Linklist widget is navigation of your blog ,you can add link to blog navigation bar by adding link in this widget .
To adding to a category to navigation ,you click on edit link on LinkList widget ,you will see this box appear .

add link to your label page with this structure :
http://your blog url /search/label/labelname
remember ,there's no slash after labelname .
10, in other place ,you can add widget as you want . In default ,I added HTML javascript widget . You can place adsense code in these widgets and start making money today
Save template .Enjoy it .