Home » Thủ thuật Blogspot
Tiện ích Recent Posts 3 cột cho Blog
07:50 |Tiện ích này rất thích hợp cho các trang giới thiệu phần mềm, ebook, quảng cáo sản phẩm,…làm cho Blog của bạn trông ngăn nắp và chuyên nghiệp hơn.
Thực hiện: (đưa vào tiện ích)
1. Vào Thiết kế > Phần tử trang
2. Tạo một widget HTML/JavaScript và dán code bên dưới vào :
Kiểu 1
Nguồn: http://www.dvt.com.vn/2012/09/tien-ich-recent-posts-3-cot-cho-blog.html#ixzz26jrdzLFF
Đọc tiếp…
Thực hiện: (đưa vào tiện ích)
1. Vào Thiết kế > Phần tử trang
2. Tạo một widget HTML/JavaScript và dán code bên dưới vào :
Kiểu 1
<style type="text/css">
#itechplus-rc-3cot {width:298px;}
table#itechplus-rc-3cot {border:1px solid #ccc;}
#rc-3cot {padding:0 8px;width:30%;}
#rc-3cot p{padding:0;margin:0 0 5px 0;}
#rc-3cot img {margin:8px 0 2px; height:55px; width:75px; border:1px solid #ccc; padding:1px;}
#rc-3cot a:link {font:normal 12px arial;}
#itechplus-rc-3cot h2 {
background:url(#) no-repeat top left;
padding:5px 0 14px 15px;
font:bold 13px Verdana;
margin:0px;
color:#fff;
}
</style>
<script type="text/javascript">
home_page = "http://www.dvt.com.vn/";
label = "Ảnh chụp bằng ĐTDĐ";
numposts = 9;
sumTitle = 18;
colortitle = "#333";
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihk_B8P_hgkkDnNqZ8l0kH2s_QRpg1MiT7P4taRbo9SgIe6Je0dHKR_Madkr0IHGHsASrDZX21WcyvHRy8xHHr_RN6VvLbdmHv88hw0eG6Tzi95NIZV29dboe2Jl5P8sGwInMsbewv0Wc/";
showRandomImg = true;
</script>
<div id="itechplus-rc-3cot">
<script src=" https://dl.dropbox.com/u/74775294/Filejs/itechplus-rc-3cot.js " type="text/javascript"></script>
<p style="float:right;margin:0;padding:3px"><a href="http://www.dvt.com.vn/search/label/%E1%BA%A2nh%20ch%E1%BB%A5p%20b%E1%BA%B1ng%20%C4%90TD%C4%90?&max-results=6">Xem thêm»</a></p>
</div>
#itechplus-rc-3cot {width:298px;}
table#itechplus-rc-3cot {border:1px solid #ccc;}
#rc-3cot {padding:0 8px;width:30%;}
#rc-3cot p{padding:0;margin:0 0 5px 0;}
#rc-3cot img {margin:8px 0 2px; height:55px; width:75px; border:1px solid #ccc; padding:1px;}
#rc-3cot a:link {font:normal 12px arial;}
#itechplus-rc-3cot h2 {
background:url(#) no-repeat top left;
padding:5px 0 14px 15px;
font:bold 13px Verdana;
margin:0px;
color:#fff;
}
</style>
<script type="text/javascript">
home_page = "http://www.dvt.com.vn/";
label = "Ảnh chụp bằng ĐTDĐ";
numposts = 9;
sumTitle = 18;
colortitle = "#333";
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihk_B8P_hgkkDnNqZ8l0kH2s_QRpg1MiT7P4taRbo9SgIe6Je0dHKR_Madkr0IHGHsASrDZX21WcyvHRy8xHHr_RN6VvLbdmHv88hw0eG6Tzi95NIZV29dboe2Jl5P8sGwInMsbewv0Wc/";
showRandomImg = true;
</script>
<div id="itechplus-rc-3cot">
<script src=" https://dl.dropbox.com/u/74775294/Filejs/itechplus-rc-3cot.js " type="text/javascript"></script>
<p style="float:right;margin:0;padding:3px"><a href="http://www.dvt.com.vn/search/label/%E1%BA%A2nh%20ch%E1%BB%A5p%20b%E1%BA%B1ng%20%C4%90TD%C4%90?&max-results=6">Xem thêm»</a></p>
</div>
<style type="text/css">
#itechplus-rc-3cot {width:610px;}
table#itechplus-rc-3cot {border:1px solid #ccc;}
#rc-3cot {padding:0 8px;width:30%;}
#rc-3cot p{padding:0;margin:0 0 5px 0;}
#rc-3cot img {margin:8px 0 2px; height:160px; width:160px; border:1px solid #ccc; padding:1px;}
#rc-3cot a:link {font:normal 12px arial;}
#itechplus-rc-3cot h2 {
background:#999999;
padding:5px 0 14px 15px;
font:bold 13px Verdana;
margin:0px;
color:#fff;
}
</style>
<script type="text/javascript">
home_page = "http://www.dvt.com.vn/";
label = "Thùng loa";
numposts = 6;
sumTitle = 24;
colortitle = "#333";
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihk_B8P_hgkkDnNqZ8l0kH2s_QRpg1MiT7P4taRbo9SgIe6Je0dHKR_Madkr0IHGHsASrDZX21WcyvHRy8xHHr_RN6VvLbdmHv88hw0eG6Tzi95NIZV29dboe2Jl5P8sGwInMsbewv0Wc/";
showRandomImg = true;
</script>
<div id="itechplus-rc-3cot">
<h2>
Thùng loa<div style="float: right; margin: 0; padding: 3px;">
<a href="http://www.dvt.com.vn/search/label/Th%C3%B9ng%20loa?&max-results=6"><span style="color: white;"> Xem thêm »</span></a></div>
</h2>
</div>
<script src="https://dl.dropbox.com/u/74775294/Filejs/itechplus-rc-3cot.js" type="text/javascript"></script>Trong đoạn code trên :
- width:610px; : chiều rộng của widget
- height:160px; width: 160 px; : chiều rộng và chiều cao của ảnh đại diện
- home_page = "http://www.dvt.com.vn"; : địa chỉ blog của bạn
- label = " Thùng loa "; : tên trương mục muốn hiển thị
- numposts = 6; : số bài viết sẽ hiển thị
- sumTitle = 24; : số ký tự dòng tiêu đề bài đăng
- colortitle = "#333"; : màu tiêu đề bài đăng
- background:#999999; : màu của thanh tiêu đề nhãn
- imgr[0] = “…”; : hình đại diện cho bài viết không có ảnh
Các bạn thay đổi cho phù hợp (có thể thử code và điều chỉnh tại đây).
Nguồn: http://www.dvt.com.vn/2012/09/tien-ich-recent-posts-3-cot-cho-blog.html#ixzz26jrdzLFF
Tự động chuyển sang địa chỉ blog khác
17:11 |Khi bạn thay đổi blog và muốn thông báo với những khách thăm blog bạn về việc bạn đã chuyển địa chỉ, với thủ thuật sau sẽ tự động chuyển địa chỉ URL cũ sang trang mới của bạn sau vài giây:
CÁCH THỰC HIỆN
1. Vào Design (Thiết kế) > Edit HTML (Chỉnh sữa HTML) không cần đánh dấu chọn ô: Expand Widget Templates (Mở rộng mẫu tiện ích)
1. Vào Design (Thiết kế) > Edit HTML (Chỉnh sữa HTML) không cần đánh dấu chọn ô: Expand Widget Templates (Mở rộng mẫu tiện ích)
2. Tìm thẻ <head>
- Thêm vào sau nó dòng code sau:
<meta http-equiv="Refresh" content="5; url=http://www.dothang.name.vn" />
Thay số 5 thành số giây tự động chuyển Domain sau khoảng thời gian chỉ định.
Thay www.dothang.name.vn thành địa chỉ Domain mới của bạn.
Nếu chỉ muốn chuyển URL thì đến đây ta Save template là xong, còn muốn có thêm dòng thông báo thì làm tiếp phần 3.
3. Tạo dòng thông báo
- Tìm thẻ <body>
- Thêm vào sau nó đoạn code sau:
Nếu chỉ muốn chuyển URL thì đến đây ta Save template là xong, còn muốn có thêm dòng thông báo thì làm tiếp phần 3.
3. Tạo dòng thông báo
- Thêm vào sau nó đoạn code sau:
<div align="center"> <div style="background: #fffce3; border: #ccc 1px solid; margin: 10px; padding: 5px; text-align: justify; width: 480px;"> <div style="text-align: justify;"> <b><span style="font-family: Arial, Helvetica, sans-serif;"><span style="text-align: left;">Chào bạn! Blog đã chuyển sang Domain mới. Địa chỉ mới là: <a href="http://www.dothang.name.vn/">http://www.dothang.name.vn</a>. Bạn sẽ được tự động chuyển sang Domain mới sau 5 giây, kể từ khi đọc được dòng thông báo này!</span></span></b></div> </div> </div>
Thay http://www.dothang.name.vn thành địa chỉ Domain mới của bạn. và tùy chỉnh lại nội dung thông báo chuyển domain cho phù hợp với blog.
#fffce3 màu nền
480px chiều dài của khung
4. Save template.
#fffce3 màu nền
480px chiều dài của khung
4. Save template.
Đổi tài khoản Email quản trị Blogger
17:03 |Chuyển đổi tài khoản Gmail quản lý Blogger sang tài khoản Gmail khác mà không làm mất những bài viết trước đó. Cách làm này dựa vào quản lý cấp phép thêm tác quản trị của Blogger.
Cách làm như sau:
1. Bạn truy cập theo đường dẫn: Bảng điều khiển > Cài đặt >Quyền.
2. Tại mục Tác giả Blog, bạn bấm vào "Thêm tác giả", sau đó nhập địa chỉ Gmail mới mà bạn muốn sử dụng để quản trị Blog này, bấm chọn "Mời" .
2. Tại mục Tác giả Blog, bạn bấm vào "Thêm tác giả", sau đó nhập địa chỉ Gmail mới mà bạn muốn sử dụng để quản trị Blog này, bấm chọn "Mời" .
- Đăng nhập vào tài khoản Gmail mới, bấm vào liên kết xác nhận trong email có tiêu đề "Bạn đã được mời đóng góp vào ...". Sau đó đăng nhập vào Blogger.
Tài khoản email mới lúc này chỉ có thể tham gia viết bài cho blog mà chưa có quyền quản trị.
3. Vào lại Blogger theo đường dẫn bước 1 bằng tài khoản Gmail lúc đầu. Lúc này bạn sẽ thấy trong danh sách "Tác giả có thể đăng bài trên Blog này" đã có thêm tài khoản Gmail mới. Tiếp tục bấm vào "Cấp đặc quyền quản trị" ở tài khoản Gmail mới. Lúc này 2 tài khoản Gmail có quyền quản trị ngang nhau.
SlideTab Recent posts chuyển động ngang
16:16 |
- Vào code template (thiết kế -> chỉnh sửa code HTML), và chèn đoạn mã code bên dưới vào trước thẻ đóng </head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
- Nếu trong code template của bạn đã có file jquery.min.js thì không cần chèn vào nữa.- Tiếp theo, tạo 1 widget HTML/javascript và chèn đoạn code bên dưới :
<div align="left">
<style type="text/css">
#slidearea {
height: 242px;
overflow: hidden;
margin: 0px 00px 0 0px;
position: relative;
width: 948px;
background: url( https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtht5LTzsgMdFSpIIo1wWr0bVs-t-RxlC9mNv-8xYMYHrm55D3-skPYJPDxXxKIBOVyma0mc3WjNd7G9Vnp4W7_V9jiozhcyujDrKcfWdytPvXez-7s1JAO_9OuCyJJqoIZhsCF3vN87IS/s0/slider.png) no-repeat;
}
#gallerycover {
overflow: hidden;
margin: 15px 24px 0 24px;
width: 900px;
}
.mygallery {
overflow: hidden;
visibility: visible;
position: relative; z-index: 2;
left: 0px;
width: 900px;
}
.mygallery ul {
margin:0;
padding:0;
position: relative;
list-style-type: none;
z-index: 1;
width: 2700px;
left: -1620px;
}
.mygallery ul li {
overflow: hidden;
float: right;
width: 180px;
height: 210px;
}
.mytext {
position: relative;
margin: 0 5px 0 5px;
width: 170px;
height: 210px;
display: inline;
float: left;
color: #C4C4C4;
}
.mytext p {
padding: 0 0;
color: #555;
font-size: 12px;
line-height: 20px;
width: 170px;
text-shadow: 1px 1px 0 #F6F6F6;
}
.mytext h2 {
padding: 5px 0;
color: black;
width: 170px;
font-size: 14px;
font-weight: bold;
}
.mytext h2 a:link, .mytext h2 a:visited {
color: black;
text-decoration: none;
outline: none;
}
.mytext h2 a:hover {color:#888;}
img.sidim {
width: 170px;
height: 100px;
}
.prevb {
float: left;
width: 15px;
height: 27px;
z-index: 200;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIptFKijztGQZZp_uxTaobBnhJSXqE6HA8r2OkVSbNFzRe9DkP2tis1RWYWvloUl217cKgLMNMNQOWmyle7IPadZrtLAo_Aclc8qrnISiI0uDxeYPocLxCFwHTpfGUq5Gvziua_Dmr-zAL/s0/prev.png)!important;position: absolute;
left: 5px;
bottom: 110px;
}
.nextb {
float: right;
width: 20px;
height: 35px;
z-index: 200;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8SDhcxDPT-CssuyiLn8mVYY714TJ5tqzbAKk2HC29vuOiRspgAWbINPNWcP2khHlelIYtOyZ40PFQZ4LFfQD-UgMQfrDeY0l3LzrDbH9bB1Yxazc3fyWjWW0EbpUlJlNTfLiwdBbn8VmW/s0/next.png)!important;
position: absolute;
right: 5px;
bottom: 110px;
display: block;
}
</style>
<script src="https://dl.dropbox.com/u/74775294/Filejs/slide-mygallery.js" type="text/javascript"></script>
<script stype="text/javascript">
var $jx = jQuery.noConflict();
$jx(function() {
$jx(".mygallery").jCarouselLite({
btnNext: ".nextb",
btnPrev: ".prevb",
visible: 5,
auto: 3000,
speed: 1000,
easing: "backout"
});
});
</script>
<div id="slidearea">
<div id="gallerycover">
<div class="mygallery">
<ul>
<script type="text/javascript">
var mode = "all";
var g_numposts = 10;
var g_numcontents = 15;
var g_label="Đặc sản Hà Nam";
var homepage="http://www.dvt.com.vn";
</script>
<script src="https://dl.dropbox.com/u/74775294/Filejs/feed-mygallery.js" type="text/javascript"></script>
</ul>
<div class="clear"></div>
</div>
</div>
<a class="prevb" href="#"></a>
<a class="nextb" href="#"></a>
</div>
Hướng dẫn tùy chỉnh :
- visible: 5 đây là số bài viết sẽ được hiển thị ra ngoài, như trong demo là 3.
- auto: 3000 đây là thời gian chạy auto, 3000 tương ứng với 3 giây, tức là sau 3 giây tự động chuyển bài.
- speed: 1000 là tốc độ chuyển bài viết khi click vào button left hoặc right (mũi tên màu cam)
- Lưu ý : nếu không muốn chạy auto, thì bạn bỏ dòng auto: 3000, trong đoạn code javascript, tức là đoạn script ở trên chỉ còn như bên dưới :
<script stype="text/javascript">
var $jx = jQuery.noConflict();
$jx(function() {
$jx(".mygallery").jCarouselLite({
btnNext: ".nextb",
btnPrev: ".prevb",
visible: 5,
speed: 1000,
easing: "backout"
});
});
</script>
- var mode = "all"; là chế độ hiển thị theo cả blog hoặc theo 1 nhãn nào đó, nếu giá trị là all thì hiển thị các bài viết mới của blog, nếu giá giá trị là single thì sẽ hiển thị bài viết theo nhãn được chọn (là biến g_label bên dưới)var $jx = jQuery.noConflict();
$jx(function() {
$jx(".mygallery").jCarouselLite({
btnNext: ".nextb",
btnPrev: ".prevb",
visible: 5,
speed: 1000,
easing: "backout"
});
});
</script>
- var g_numposts = 10; là số bài viết sẽ load (lưu ý là số bài viết sẽ load (g_numposts) khác với số bài viết sẽ được hiển thị (visible: {giá trị thiết lập}) )
- var g_numcontents = 15; số chữ (là các chuỗi ngăn cách bằng dấu khoảng trắng) sẽ được hiển thị ở đoạn mô tả bài viết.
- var g_label=" Đặc sản Hà Nam"; tên nhãn sẽ được chọn nếu hiển thị ở chế độ mode = "single";
- var homepage="http://www.dvt.com.vn"; thay http://www.dvt.com.vn thành tên domain ( domain.blogspot.com) của blog bạn.
"Hướng dẫn tạo Form cho web/blog với JotForm"
09:30 |Theo yêu cầu của bạn Hà Ngọc Tú, hôm nay mình chia sẻ cùng các bạn cách tạo Form với jotform để có thể sử dụng form làm form liên hệ hay một số mục đích khác trên blog hay web. Với jotform thì bạn có thể nhanh chóng tạo được Form theo phong cách của mình và việc quản lý form cũng rất thuận tiện, bạn có thể dễ dàng thay đổi thông tin ngay khi form đã được thiết kế xong, mọi thông tin thay đổi sẽ được tự động cập nhật. Việc tạo Form này sẽ không quá khó nếu bạn hiểu được một số công cụ của nó, để có thể tạo form riêng cho mình bạn hãy vào đây để tạo cho mình một tài khoản riêng ở Jotform.
Sau khi đã đăng ký xong tài khoản bạn hãy đăng nhập vào tài khoản của mình để bắt đầu tạo Form. Trước khi bắt đầu tạo form mình giới thiệu đến các bạn một số công cụ và thuộc tính cơ bản của jotform để bạn dễ làm việc hơn.
A. Giới thiệu về các thuộc tính Form
I. Form Style
Đây là phần bạn sẽ có thể tùy chỉnh thuộc tính của Form như Themes, Font, Background, Width...
- Themes: Bạn có thể chọn một số giao diện có sẳn cho form
- Font: Bạn có thể chọn font chữ (Times, arial..), cỡ chữ (Font size)hay màu chữ (Font color) cho Form.
- Background: Màu nền của form
- Form Width: bạn có thể chọn độ rộng của Form phù hợp với blog bạn
- Label Width hay Label Align: là độ rộng và canh lề cho các tiêu đề của các điều khiển trong form như tiêu đề textbox, tiêu đề checkbox...
II. Setup & Embed
- Email Elerts: Ở đây bạn có thể chọn email nhận tin thông báo (Notification email) từ Jotform hay thiết lập nội dung trả lời tự động khi có người sử dụng form để gửi thông tin đến bạn.
- Thank you: Đây là phần bạn có thể thiết lập lời cảm ơn hay thông báo hiển thị sau khi người dùng đã gửi thông tin đến bạn.
- Embed Form và Source code: Đây là bước cuối cùng sau khi bạn thiết lập xong form của bạn, ở đây bạn có thể lấy code để chèn vào blog/web của bạn.
- Preferences: Bạn có thể xem và chỉnh sửa các thuộc tính Form của bạn.
- Conditions: Phần điều kiện.
III. Properties
Khi bạn click vào một điều khiển nào đó thì phần Properties sẽ hiện ra giúp bạn đặc một số thuộc tính cho điều khiển đó. Tùy vào mỗi điều khiển mà phần Properties sẽ khác nhau, cơ bản là một số thuộc tính bên dưới.
- Label Align: Canh lề cho điều khiển đó trên (top), trái (left), phải (right)
- Required: Bật (On) hay tắt (Off) tính năng bắt buộc của trường đó, nếu trường đó bạn muốn người dùng phải nhập (Không thể bỏ trống) thì bật thuộc tính này, khi được bật bạn sẽ thấy dấu (*) ở phía sau tiêu đề của trường đó.
- Size: Tùy chỉnh kích thước của khung nhập nội dung (phía sau tiêu đề của trường đó)
- Validation: Bạn quy định đặc tính của trường đó là email, số hay text..., nếu nhập sai sẽ báo lỗi.
- Default Value: Đây là giá trị mặc định của trường, nó sẽ hiển thị khi người chưa nhập nội dung.
- Sub Label: Phần này sẽ hiển thị bên dưới trường, mang tính chất hướng dẫn nhập nội dung của trường đó.
- Hint Example: Phần gợi ý cho trường đó.
- Hover Text: Là phần mô tả về trường đó, nó sẽ xuất hiện khi người dùng rê chuột vào trường đó.
IV. Các điều khiển (Cột bên trái)
- Heading: Đặc tiêu đề của Form
- Text Box: Tạo ô văn bản như họ và tên, địa chỉ...
- Text Area: Đây là vùng để bạn cho phép người dùng để lại nội dung trong form
- Drop Down: Là một danh sách tùy chọn thả xuống được thiết kế sẵn, nếu bạn muốn người dùng chọn từ list thì bạn có thể sử dụng điều khiển này.
- Radio Button và Check Box: Cả 2 có tác dụng như nhau giúp người dùng chọn 1 trong các tùy chọn được thiết lập sẵn, chúng chỉ khác nhau về hình thức.
- File Upload: Nếu bạn muốn người dùng đính kèm file cho bạn thì bạn có thể sử dụng điều khiển này.
- Submit Form: Nút này để người dùng gửi tính đến bạn sau khi họ nhập xong nội dung.
Đó là một số điều khiển cơ bản để tạo Form, ngoài ra còn một số điều khiển khác ở phần Quick Tools, Survey Tools, Power Tools, Payment Tools mình không giới thiệu ở đây, bạn tự tìm hiểu thêm nhe, nếu không hiểu có thể để lại comment bên dưới mình sẽ giúp bạn.
B. Các thao tác thực hiện
Để tạo ra các trường của Form thì bạn chỉ việc kéo và thả các điều khiển ở cột bên trái vào vùng trắng bên phải, và tùy chỉnh lại tiêu đề (Nhấp đôi vào tiêu đề để chỉnh sửa) hay thuộc tính của chúng. bạn xem phần Properties ở trên để tùy chỉnh lại cho phù hợp. Ở mỗi điều khiển thì bạn có thể đặt thuộc tính của nó nhanh bằng cách click vào biểu tượng cài đặt bên phải hoặc nếu muốn xóa bỏ điiều khiển hay trường đó thì bạn click dấu chéo màu đỏ bên phải (x).
Ngoài ra ở phần nút Submit Form bạn cũng có thể thêm các nút Clear Form (Xóa nhập lại), Print Form (In Form) bằng cách chọn vào điều khiển Submit Botton trong phần thiết kế và nhấn nút Reset Button và Print Button ở phần Properties của chúng.
Sau khi đã thiết kế xong bạn chọn Setup & Embed hay Source code để lấy mã chèn vào web hay blog của mình là xong.
Hình ảnh minh họa kết quả
Ở trên mình chỉ giúp bạn những bước cơ bản để tạo Form, còn để hiểu rỏ hơn thì rất dài, bạn có thể tự tìm hiểu thêm một số thuộc tính khác, nếu có thắc mắc vui lòng để lại nhận xét bên dưới mình sẽ giải đáp giúp bạn.
Code dán banner quảng cáo dưới label
Đọc tiếp…
Sau khi đã đăng ký xong tài khoản bạn hãy đăng nhập vào tài khoản của mình để bắt đầu tạo Form. Trước khi bắt đầu tạo form mình giới thiệu đến các bạn một số công cụ và thuộc tính cơ bản của jotform để bạn dễ làm việc hơn.A. Giới thiệu về các thuộc tính Form
I. Form Style
Đây là phần bạn sẽ có thể tùy chỉnh thuộc tính của Form như Themes, Font, Background, Width...- Themes: Bạn có thể chọn một số giao diện có sẳn cho form
- Font: Bạn có thể chọn font chữ (Times, arial..), cỡ chữ (Font size)hay màu chữ (Font color) cho Form.
- Background: Màu nền của form
- Form Width: bạn có thể chọn độ rộng của Form phù hợp với blog bạn
- Label Width hay Label Align: là độ rộng và canh lề cho các tiêu đề của các điều khiển trong form như tiêu đề textbox, tiêu đề checkbox...
II. Setup & Embed
- Email Elerts: Ở đây bạn có thể chọn email nhận tin thông báo (Notification email) từ Jotform hay thiết lập nội dung trả lời tự động khi có người sử dụng form để gửi thông tin đến bạn.- Thank you: Đây là phần bạn có thể thiết lập lời cảm ơn hay thông báo hiển thị sau khi người dùng đã gửi thông tin đến bạn.
- Embed Form và Source code: Đây là bước cuối cùng sau khi bạn thiết lập xong form của bạn, ở đây bạn có thể lấy code để chèn vào blog/web của bạn.
- Preferences: Bạn có thể xem và chỉnh sửa các thuộc tính Form của bạn.
- Conditions: Phần điều kiện.
III. Properties
Khi bạn click vào một điều khiển nào đó thì phần Properties sẽ hiện ra giúp bạn đặc một số thuộc tính cho điều khiển đó. Tùy vào mỗi điều khiển mà phần Properties sẽ khác nhau, cơ bản là một số thuộc tính bên dưới.
- Label Align: Canh lề cho điều khiển đó trên (top), trái (left), phải (right)- Required: Bật (On) hay tắt (Off) tính năng bắt buộc của trường đó, nếu trường đó bạn muốn người dùng phải nhập (Không thể bỏ trống) thì bật thuộc tính này, khi được bật bạn sẽ thấy dấu (*) ở phía sau tiêu đề của trường đó.
- Size: Tùy chỉnh kích thước của khung nhập nội dung (phía sau tiêu đề của trường đó)
- Validation: Bạn quy định đặc tính của trường đó là email, số hay text..., nếu nhập sai sẽ báo lỗi.
- Default Value: Đây là giá trị mặc định của trường, nó sẽ hiển thị khi người chưa nhập nội dung.
- Sub Label: Phần này sẽ hiển thị bên dưới trường, mang tính chất hướng dẫn nhập nội dung của trường đó.
- Hint Example: Phần gợi ý cho trường đó.
- Hover Text: Là phần mô tả về trường đó, nó sẽ xuất hiện khi người dùng rê chuột vào trường đó.
IV. Các điều khiển (Cột bên trái)
- Heading: Đặc tiêu đề của Form- Text Box: Tạo ô văn bản như họ và tên, địa chỉ...
- Text Area: Đây là vùng để bạn cho phép người dùng để lại nội dung trong form
- Drop Down: Là một danh sách tùy chọn thả xuống được thiết kế sẵn, nếu bạn muốn người dùng chọn từ list thì bạn có thể sử dụng điều khiển này.
- Radio Button và Check Box: Cả 2 có tác dụng như nhau giúp người dùng chọn 1 trong các tùy chọn được thiết lập sẵn, chúng chỉ khác nhau về hình thức.
- File Upload: Nếu bạn muốn người dùng đính kèm file cho bạn thì bạn có thể sử dụng điều khiển này.
- Submit Form: Nút này để người dùng gửi tính đến bạn sau khi họ nhập xong nội dung.
Đó là một số điều khiển cơ bản để tạo Form, ngoài ra còn một số điều khiển khác ở phần Quick Tools, Survey Tools, Power Tools, Payment Tools mình không giới thiệu ở đây, bạn tự tìm hiểu thêm nhe, nếu không hiểu có thể để lại comment bên dưới mình sẽ giúp bạn.
B. Các thao tác thực hiện
Để tạo ra các trường của Form thì bạn chỉ việc kéo và thả các điều khiển ở cột bên trái vào vùng trắng bên phải, và tùy chỉnh lại tiêu đề (Nhấp đôi vào tiêu đề để chỉnh sửa) hay thuộc tính của chúng. bạn xem phần Properties ở trên để tùy chỉnh lại cho phù hợp. Ở mỗi điều khiển thì bạn có thể đặt thuộc tính của nó nhanh bằng cách click vào biểu tượng cài đặt bên phải hoặc nếu muốn xóa bỏ điiều khiển hay trường đó thì bạn click dấu chéo màu đỏ bên phải (x).
Ngoài ra ở phần nút Submit Form bạn cũng có thể thêm các nút Clear Form (Xóa nhập lại), Print Form (In Form) bằng cách chọn vào điều khiển Submit Botton trong phần thiết kế và nhấn nút Reset Button và Print Button ở phần Properties của chúng.
Sau khi đã thiết kế xong bạn chọn Setup & Embed hay Source code để lấy mã chèn vào web hay blog của mình là xong.
Hình ảnh minh họa kết quả
Ở trên mình chỉ giúp bạn những bước cơ bản để tạo Form, còn để hiểu rỏ hơn thì rất dài, bạn có thể tự tìm hiểu thêm một số thuộc tính khác, nếu có thắc mắc vui lòng để lại nhận xét bên dưới mình sẽ giải đáp giúp bạn.Code dán banner quảng cáo dưới label
Tạo nút bấm Download cho blog
05:52 |
Để làm việc này, các bạn phải có một số chương trình (phần mềm) hỗ trợ như là: Photoshop hoặc các phần mềm tạo nút bấm chuyên nghiệp...
Trong giới hạn bài viết này, tôi chia sẻ với các bạn cách tạo nút bấm "DOWNLOAD" có hiệu ứng động (thay đổi hình hoặc chữ Download đổi màu khi rê chuột vào) mà không cần phải nhờ phần mềm hỗ trợ nào hết chỉ cần bạn dán code và thay đổi link ảnh vào mà thôi...
Bạn bấm vào "Xem thử" để xem vài mẫu nút bấm "DOWNLOAD" nha.
Khi đang soạn bài bình thường, muốn nút bấm "DOWNLOAD" này xuất hiện ở đâu, bạn chỉ cần bấm vào thẻ HTML ở phía trên khung soạn thảo để sang chế độ HTML rồi dán code phía dưới vào, sau đó bấm thẻ VIẾT để trở về chế độ soạn thảo bài viết tiếp tục.
<a href="http://dunghennessy.blogspot.com/" style="margin-left: 1em; margin-right: 1em;" target="_blank"><img onmouseout="this.src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZUKJUcWnV11irNB16yrW4Mtb43VrtE_wYL_gZ7RlagWD1Zyn4f8rXHmbarmDx6Q8U-Ipq6sbKiCsrFUJhHcdCQZRAD7_qnaR02NwdIYVJT9ejpi4IjNkvoIcAuCvaGqEsvnw64kWwsRw/s1600/cooltext655930958.png';" onmouseover="this.src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgatMWH-iU1nVvjYB6oBkzcL5xrFTzrusfr5mkVs8HqjrWQkZtpliSVv-Uc8NWIRRAZ2uxMUaqsn6DTTVAv5zVMc3CrMyAyEbrB-Hfa_5zuq2zOOm8mk9BvY8S-YiBfJhuKumh5t4Q8fmE/s1600/cooltext655930958MouseOver.png';" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZUKJUcWnV11irNB16yrW4Mtb43VrtE_wYL_gZ7RlagWD1Zyn4f8rXHmbarmDx6Q8U-Ipq6sbKiCsrFUJhHcdCQZRAD7_qnaR02NwdIYVJT9ejpi4IjNkvoIcAuCvaGqEsvnw64kWwsRw/s1600/cooltext655930958.png" /></a>
Bây giờ, bạn thay đổi các dòng lệnh màu đỏ, xanh, vàng để phù hợp với blog của mình, trong đó:
* Link màu đỏ: là link mà mình muốn nút bấm liên kết đến (có nghĩa là khi bấm vào nút này sẽ đưa bạn đến link download phần mềm nào đó để download).
* Link màu xanh (2 link): đây là hình ảnh ban đầu của nút bấm khi chưa rê chuột vào.
* Link màu vàng: đây là hình ảnh sẽ thay đổi khi rê chuột vào.
Bạn chưa có ảnh nút bấm "DOWNLOAD"???. Mời các bạn bấm vào hình phía dưới để tham khảo một số mẫu nút bấm, nếu thích thì tải về upload lên lấy link để thay vào.
 |
| Xem và tải nút "DOWNLOAD" |
Link : http://dunghennessy.blogspot.com/2012/03/tao-nut-bam-download-cho-webblog.html
Lấy dữ liệu Blogspot khác và Bảo vệ dữ liệu blogspot bản thân.
23:09 |Các bước Lấy data của blogspot khác hay gọi lịch sự là lấy data, mà gọi không lịch sự là đi ăn cắp. Mình cũng từng bị một tên ăn chộm dự liệu bê y nguyên 2400 bài viết của mình về và upload lên host của tên vô lại đó. Các bạn có thể xem trang của tên vô lại đó TẠI ĐÂY
Mình viết bài này không khuyến khích các bạn làm thế vì mình từng là nạn nhân nên mình rất hiểu tâm trạng của người bị hại sẽ như thế nào. Dưới đây là các thủ đoạn ăn chôm của những kẻ đi choom:- Bước 1- xác định blogspot cần lấy phải thỏa mãn điều kiện rss của nó phải là rss full, rss không bật full thì chỉ lấy phần giới thiệu
- Để xác định rss là full hay không chỉ cần đánh tên địa chỉ web như sau vào :
http://diachi.blogspot.com/atom.xmlThay: diachi thành tên blog cần lấy
Ví dụ: http://namkna.blogspot.com/atom.xml
(Tất nhiên sau sự cos mất cawops mình đã fix lại rồi nên các bạn đừng thắc mắc tại sao chỉ có phần trích dẫn nha).- Nếu rss được bật full thì ta có thể lấy toàn bộ data. còn không thì dừng ở đây được rồi. Có một số template yêu cầu bắt buộc phải bật full rss như template Simplex Celebrity .... các trang tin hot teen hay dùng lắm, và một số Blogger mới vào nghề chưa biết hay quyên.
- Bước 2: Xác định tổng số bài viết có trong blogspot đó bằng cách tạo một bài viết mới và Pate co bên dưới vào phần html:
<script style="text/javascript">
function showpostcount(json) {
document.write('<center>Tổng số bài: <b>' + parseInt(json.feed.openSearch$totalResults.$t,10)
+ '</b></center>');}</script>
<script src="http://namkna.blogspot.com/feeds/posts/default?alt=json-in-script&callback=showpostcount"></script>
<script style="text/javascript"></script>Thay: namkna.blogspot.com bằng tên blog bạn cần khi đó sẽ hiển thị số bài đăng như sau:Cần xác định số bài đăng vì vì 1 số blogspot khủng data > 10000 bài nên sẽ chia nhỏ thành các đoạn data ,sau đó lấy theo khỏang từ 1-50 bài hay 1-10 bài tùy đường truyền mạng hay cấu hình máy. Blogspot cho import tối đa 500 bài.
- Bước 3: copy và paste đoạn cần lấy vào chương trình download IDM khi đó sẽ là nếu máy ai chưa cài IDm có thể download TẠI ĐÂY. Ví dụ đoạn link dưới đây là lấy từ bài 1 đến bài 10 kể từ bài đăng mới nhất.
http://diachi.blogspot.com/atom.xml?redirect=false&start-index=1&max-results=10Trong đó:
- start-index=1 bắt đầu bài đăng mới nhất
- max-result=10 lấy từ bài 1 đến bài thứ 10
- diachi.blogspot.com: là blog cần lấy Data
http://diachi.blogspot.com/atom.xml?redirect=false&start-index=11&max-results=10
http://diachi.blogspot.com/atom.xml?redirect=false&start-index=21&max-results=10
..................................- Sau đó ta thu được các file .xml (chuẩn rss hình như wordpress cũng cho phép import rss vào- chưa thử )- Bước 4: Import file xml đó vào blogspot bằng cách vào Setting ( Cài đặt ) -> Import. done ( Nhập Blog ) - Chỉ đường dẫn tới các file .XML mà bạn vừa download về.
-chú ý : khi import xong nên đăng lấy lệ 1 vài bài để xóa bỏ capchar khi import quá nhiều bài 1 lúc, google săm soi blog sẽ cho là spam sẽ disable acc .
P/s by Namkna: tránh cho blog của bạn bằng cách tắt chức năng full này đi bằng cách vào Setting ( Cài đặt ) -> Nguồn cấp dữ liệu trang Web -> tại mục Cho phép nguồn cấp dữ liệu Blog bạn chọn Cho đến dấu ngắt .
Nếu template bắt buộc đặt full thì ta nên tạo thêm 1 đoạn giới thiệu ,để khi bài được mang vác khắp nơi người đọc biết nguồn xuất phát từ đâu khi có ai dùng( 1 số hay quên ghi tác giả như mình đây)
Chúc các bạn ngăn chặn hiệu quả!
