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

Ngày Thứ Ba, 10 tháng 4, 2012 Blog của Báo Mới Hà Nội chia sẻ với bạn đọc bài viết Tạo "mã nhúng" cho mỗi bài đăng trên blog/web
Chúc bạn xem tin tức vui vẻ !!

Như các bạn đã thấy ở các trang web  như  nhaccuatui, youtube... 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 đây mình 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://tanchau123.blogspot.com' style='display:none;' target='_blank'>Widget by Tanchau123.blogspot.com</a></p>&lt;/div&gt;<br/></b:if>

Trong đoạn code trên 80 chính là độ rộng cuả 3 ô chứa mã nhúng, còn  #ffffff chính là mã màu nền cuả ô chứa mã. Lấy mã màu bạn VÀO ĐÂY 

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