Một điều chắc chắn với hầu hết tất cả mọi website đều có nút chia sẻ qua các mạng xã hội thông dụng. Việc thêm vào các nút này giúp website giữ được lượng khách truy cập đáng kể. Do đó việc làm cho khách truy cập chú ý đến nó là vấn đề khá cần thiết đối với mọi quản trị của website, từ vị trí, đến giao diện, v.v.. Hôm nay mình xin chia sẻ với các bạn những nút chia sẽ với hiệu ứng đóng mở khả là ngầu bằng CSS và JS khá bắt mắt đến người dùng.

Nút chia sẻ với hiệu ứng đóng mở cực kì ngầu cho Blogger

Bước 1: Đăng nhập vào Blogger >> Mẫu >> Chỉnh sửa HTML

Bước 2: Tìm đến thẻ </head> và thêm đoạn css sau lên trên

<style>
@import url(http://fonts.googleapis.com/css?family=Open+Sans);
@import "//netdna.bootstrapcdn.com/font-awesome/3.0/css/font-awesome.css";
#buttons {
    width: 475px;
    overflow: hidden;
    margin: 70px auto 0;
}

.button {
    float: left;
    margin-right: 10px;
    width: 110px;
    background: #eaeaea;
    border: 1px solid #cbcbcb;
    border-radius: 3px;
    -o-border-radius: 3px;
    -ms-border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    box-shadow: inset 0 1px 0px #fdfdfd;
    padding: 15px 5px 5px;
    box-sizing: border-box;
}

.button i {
    background: #c5c5c5;
    color: #eaeaea;
    text-align: center;
    line-height: 40px;
    font-size: 18px;
    width: 40px;
    height: 40px;
    display: block;
    margin: 0 auto 10px;
    border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
}

.social-container {
    text-align: center;
    text-transform: uppercase;
    font-size: 12px;
    color: #656565;
    line-height: 54px;
    font-family: Open Sans;
    background: #d8d8d8;
    width: 100%;
    height: 45px;
    box-shadow: inset 0 -2px 4px #c7c7c7;
    border-radius: 3px;
    -o-border-radius: 3px;
    -ms-border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    position: relative;
    overflow: hidden;
}

.slide, .button i {
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
}

.slide {
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15);
    border-radius: 0 0 22px 22px;
    -o-border-radius: 0 0 22px 22px;
    -ms-border-radius: 0 0 22px 22px;
    -moz-border-radius: 0 0 22px 22px;
    -webkit-border-radius: 0 0 22px 22px;
 /* top fix */
    transition: all 0.2s ease-in-out;
    position: absolute;
    height: 45px;
    width: 100%;
    top: -35px;
}

.slide::after {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 10px;
    box-shadow: inset 0 1px 0px #fdfdfd, 0 3px 0px #cdcdcd;
    border-radius: 3px;
    -o-border-radius: 3px;
    -ms-border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    background: #eaeaea;
    border: 1px solid #cbcbcb;
    box-sizing: border-box;
    bottom: 0;
}

.button:hover .slide {
    top: 0;
    border-radius: 3px;
}

.linkedin .IN-widget, .button iframe, .google #___plusone_0 {
    top: -2px;
    position: relative;
}

.twitter iframe {
    width: 79px !important;
}

.google #___plusone_0 {
    width: 60px !important;
}

.button.facebook:hover i, .facebook .slide {
    background: #305c99;
    color: white;
}

.button.twitter:hover i, .twitter .slide {
    background: #00cdff;
    color: white;
}

.button.google:hover i, .google .slide {
    background: #d24228;
    color: white;
}

.button.linkedin:hover i, .linkedin .slide {
    background: #007bb6;
    color: white;
}

.button.linkedin {
    margin-right: 0;
}

.credit {
    padding-left: 10px;
    font-size: 14px;
    color: #172b36;
    position: absolute;
    bottom: 0;
    text-align: center;
    font-family: Open Sans;
}

.credit a {
    border-bottom: 2px solid #dc4106;
    text-decoration: none;
    padding: 0 0 2px;
    color: #172b36;
}
</style>

Bước 3: Tìm đến thẻ sau

<b:includable id='post' var='post'>

thêm đoạn mã sau ngay trên

<b:includable id='kslshare'>
<b:if cond='data:blog.pageType == "item"'>
<div id="buttons">
<div class="facebook button">
 <i class="icon-facebook"></i>
 <div class="social-container fb">
  <div class="slide">
   <iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fdevelopers.facebook.com%2Fdocs%2Freference%2Fplugins%2Flike&send=false&layout=button_count&width=90&show_faces=false&font&colorscheme=light&action=like&height=21&appId=568581339861351" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:81px; height:21px;" allowtransparency="true">
   </iframe>
  </div>
   Facebook
 </div>
</div>
<div class="twitter button">
 <i class="icon-twitter"></i>
 <div class="social-container tw">
  <div class="slide">
   <a href="https://twitter.com/share" class="twitter-share-button" data-via="mariuCSS">
   Tweet </a>
   <script>
    !function(d,s,id){
      var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';
      if(!d.getElementById(id)){
        js=d.createElement(s);
        js.id=id;
        js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');
  </script>
  </div>
   Twitter
 </div>
</div>
<div class="google button">
 <i class="icon-google-plus"></i>
 <div class="social-container tw">
  <div class="slide">
   <!-- Place this tag where you want the +1 button to render. -->
   <div class="g-plusone" data-size="medium">
   </div>
   <!-- Place this tag after the last +1 button tag. -->
   <script type="text/javascript">
    (function() {
      var po = document.createElement('script');
      po.type = 'text/javascript';
      po.async = true;
      po.src = 'https://apis.google.com/js/plusone.js';
      var s = document.getElementsByTagName('script')[0];
      s.parentNode.insertBefore(po, s);
    }
    )();
  </script>
  </div>
   Google+
 </div>
</div>
<div class="linkedin button">
 <i class="icon-linkedin"></i>
 <div class="social-container tw">
  <div class="slide">
   <script src="//platform.linkedin.com/in.js" type="text/javascript">
 lang: en_US
   </script>
   <script type="IN/Share"></script>
  </div>
   LinkedIN
 </div>
</div>
</div>
<div style="text-align: right;">
<a href="http://goo.gl/3nMvSh" target="_blank" title="Lấy widget này"><span style="font-size: x-small;">get</span></a></div>
</b:if>
</b:includable>

thay developers.facebook.com thành địa chỉ page facebook của bạn

Bước 4: Tìm đến các thẻ

<data:post.body/>

và thêm đoạn mã này xuống dưới

<b:include name='kslshare'/>

Bước 5: Lưu lại giao diện hiện tại.

Như vậy là bạn đã chèn xong các nút chia sẻ thật là ngầu dưới chân bài viết của bạn, mong rằng nó giúp cho website có thêm thật nhiều khách truy cập! 

Read more…

Những khách hàng đăng ký dịch vụ Hosting Cpanel - Driectadmin tại VMMS sẽ nhận được username/password để quản trị. 

HƯỚNG DẪN SỬ DỤNG DIRECTADMIN
VỚI QUYỀN USER

1. Đăng nhập vào hệ thống:

http://IP:2222 hoặc http://domain.com:2222

 

2. Bảng điều khiển tổng quan:

Bên phải là các thông số của host

3. Thay đổi password hosting:

Từ bản điều khiển chính, chọn Change Password

Nhập password mới và nhấn Submit

4. Quản lý tài khoản FTP:

Từ bản điều khiển chính, chọn FTP Management

a. Để tạo mới tài khoản bạn nhấn chọn Create FTP account

Điền đầy đủ thông tin và nhấn Create

5. Quản lý cơ sở dữ liệu:

Từ bản điều khiển chính, nhấn chọn Mysql Management

a. Backup database:

Để backup database thì bạn nhấn chọn nútDownload tương ứng cới database tại cột Download Backup

b. Restore từ file đã backup:

Bạn thực hiện theo các bước như hình trên: Chọn database muốn restore, Tiếp theo nhấn Browse và chọn file đã backup, cuối cùng nhấn Upload

c. Tạo database mới:

Khai báo đầy đủ thông tin và nhấn Create

6. Quản lý file:

Từ bảng menu chính, nhấn chọn File Manager

+ Để website hoạt động, code website phải được upload trong thư mục public_html

a. Để phần quyền cho 1 file hoặc thư mục, bạn tích chọn vào ô tích tại cột Select tương ứng với file mà bạn muốn phân quyền, điền thông số và nhấn set Permission

Ví dụ để cấp full quyền cho 1 thư mục ta làm như sau:

b. Để upload file lên host ta thao tác như sau:

Duyệt chọn file cần upload và nhấn nút Upload Files. Tối đa có thể upload 8 file cùng 1 lúc, để upload được nhiều file cùng 1 lúc hơn thì bạn chọn Upload Even More Files
Dung lượng 1 file tối đa được phép upload 10MB

Bạn có thể sử dụng FTP để upload được nhanh hơn, nhiều hơn, nhiều file cùng 1 lúc và đơn giản hơn. Nếu chưa có phần mềm upload FPT bạn có thể download tại đây:
http://download.vmms.vn/Cute8.0.rar 

7. Quản lý domain:

Từ bảng điều khiển chính, bạn chọn Domain Setup

a. Add thêm 1 tên miền mới và host: Từ giao diện quản lý domain Add Another Domain. Bạn nhập domain mới cần add và nhấn Create

b. Để suspend hay unsuspend 1 domain bạn tích chọn domain đó và nhấn Suspend / Unsuspend

c. Để xóa 1 domain ra khỏi host thì bạn tích hợp domain và nhấn Delete

8. Quản lý subdomain:

Từ menu chính, chọn Subdomain Management

Để add subdomain, bạn nhập subdomain muốn tạo và nhấn Create

Để Subdomain hoạt động được. Trên hệ thống DNS quản lý tên miền. Bạn phải tạo 1 bản ghi A là tên subdomain đó và trở về IP server mà bạn muốn tạo subdomain.

9. Add một tên miền chạy song song với tên miền chính:

Từ bảng điều khiển Domain Pointers

Để add 1 tên miền chạy song song, bạn nhập tên miền muốn add và nhấn Add

10. Backup và restore hosting:

Từ bảng điều khiển chính, chọn Create/Restore Backups

a. Để backup Full bạn tích chọn tất cả các mục và nhấn Create Backup

b. Để restore bạn chọn file đã backup và nhấn Select Restore Options

 11. Tạo email:

Để hệ thống mail hoạt động.

Bạn phải tạo bản ghi MX trỏ về server.

Read more…

www.flamingtext.com

Là trang cho phép chúng tạo một logo cho wap/web của bạn cực đẹp với nhiều mẫu khác nhau, từ đơn giản đến phức tạp.

Ngoài ra người dùng có thể tùy biến theo ý bằng nhiều công cụ về phồng chữ, màu sắc đến kích cỡ...

Nguồn: http://soctrangit.blogspot.com

Read more…

Menu là một trong các thành phần quan trọng của web, hẳn bạn phải nhiều lần đau đầu tìm kiếm, thiết kế cho mình 1 mẫu ưng ý.
Vuikhoe xin giới thiệu với các bạn 1 trang web cung cấp các mẫu menu viết bằng jquery khá đẹp và bắt mắt.
Đó chính là trang http://apycom.com

Trang web cung cấp cho bạn nhiều mẫu menu với nhiều màu sắc, kiểu dáng và hiệu ứng khác nhau. Menu có tất cả 3 cấp. Bạn có thể mua trọn bộ (full color) hoặc download miễn phí.
Sử dụng miễn phí thì sẽ có backlink của trang web. Nếu bạn xoá backlink thì sẽ hiện 1 dòng thông báo No backlink khó chịu trên góc trang web.

Read more…