down

3.28.2012

Tạo "mã nhúng" cho mỗi bài đăng trên Blogspot

Như các bạn đã thấy ở các trang web  như  nhaccuatui, youtobe... những khi bạn nghe 1 bài hát nào đó thì chắc các bạn cũng thấy phần liên kết url, copy link vào blog, forum. Với những phần đó bạn có thể nhúng vào web/blog.

                                                                    DEMO



Sau tôi sẽ giúp các bạn trình bày tiện ích này dưới mỗi bài viết:
1. Đăng nhập vào blog → thiết kế → chỉnh sửa HTML.
2. Đặt đoạn code dưới đây trước thẻ ]]></b:skin>


.about-article{ background-color:#f9f9f9; padding-bottom:5px; padding-left:20px; font-size:11px; } .about-article input{ background-color:#ffffff; }

3. Tiếp tục tìm đến đoạn code <data:post.body/>
Và đặt toàn bộ đoạn code sau dưới nó:


<b:if cond='data:blog.pageType == &quot;item&quot;'>
&lt;div class=&quot;about-article&quot;&gt;<p>If you find this article useful, please feel free to link to this page from your website or blog.</p>&lt;p class=&quot;noborder&quot;&gt;&lt;label for=&quot;aa-url&quot;&gt;URL:&lt;/label&gt;&lt;br /&gt;&lt;input size=&quot;80&quot; readonly=&quot;readonly&quot; onclick=&quot;this.focus();this.select();&quot; type=&quot;text&quot; id=&quot;aa-url&quot; value=&quot;<data:post.url/>&quot; /&gt;&lt;/p&gt;&lt;p&gt;&lt;label for=&quot;aa-forum&quot;&gt;HTML Link:&lt;/label&gt;&lt;br /&gt;&lt;input size=&quot;80&quot; readonly=&quot;readonly&quot; onclick=&quot;this.focus();this.select();&quot; type=&quot;text&quot; id=&quot;aa-forum&quot; value=&quot;&lt;a href=&amp;quot;<data:post.url/>&amp;quot;&gt;<data:post.title/>&lt;/a&gt;&quot; /&gt;&lt;/p&gt;&lt;p&gt;
&lt;label for=&quot;aa-forum&quot;&gt;Forum Link:&lt;/label&gt;&lt;br /&gt;
&lt;input size=&quot;80&quot; readonly=&quot;readonly&quot; onclick=&quot;this.focus();this.select();&quot; type=&quot;text&quot; id=&quot;aa-forum&quot; value=&quot;[url=<data:post.url/>]/<data:post.title/>[/url]&quot; /&gt;&lt;/p&gt;
<p align='center'><a href='http://www.bloggertipandtrick.net/' style='display:none;' target='_blank'>Widget by BloggerTipAndTrick</a></p>
&lt;/div&gt;<br/>
</b:if>


4. Lưu mẫu.
Chúc các bạn thành công!!!

0 comments

Post a Comment