Tìm kiếm nhanh

Hướng dẫn chèn tabs theo Bootstrap áp dụng cho news và shop

Thảo luận trong 'Hỗ trợ modules' đăng bởi hoanglongvnpt, 09/07/2016 04:04.

  • hoanglongvnpt

    hoanglongvnpt Nguyễn Tất Thắng

    Đã có bài hướng dẫn chèn tabs cho các bạn rồi, nhưng hôm nay mình sẽ hướng dẫn cách chèn tabs theo Bootstrap có sẵn, áp dụng cho cả News và Shop. Bạn nào biết gì thêm thì góp ý để cùng hoàn thiện.

    Theo cơ chế Bootstrap có sẵn 

    Link: http://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_tabs_dynamic&stacked=h

    Mình sẽ áp dụng cho cơ chế tabs như sau:

    <ul class="nav nav-tabs">
        <li class="active"><a data-toggle="tab" href="#menu0">Tên DL 1</a></li>
        <li><a data-toggle="tab" href="#menu1">Tên DL 2</a></li>
        <li><a data-toggle="tab" href="#menu2">Tên DL 3</a></li>
        <li><a data-toggle="tab" href="#menu3">Tên DL 4</a></li>
        <li><a data-toggle="tab" href="#menu4">Tên DL 5</a></li>
        <li><a data-toggle="tab" href="#menu5">Tên DL 6</a></li>
      </ul>
      <div class="tab-content">
        <div id="menu0" class="tab-pane fade in active">
          [KHOIDL1]
        </div>
        <div id="menu1" class="tab-pane fade">
        [KHOIDL2]      
        </div>
        <div id="menu2" class="tab-pane fade">
        [KHOIDL3]      
        </div>
        <div id="menu3" class="tab-pane fade">
        [KHOIDL4]     
        </div>
        <div id="menu4" class="tab-pane fade">
         [KHOIDL5]     
        </div>
        <div id="menu5" class="tab-pane fade">    
          [KHOIDL6]
        </div>   
      </div>

    Mở file config.ini thêm các

             <position>
    			<name>TÊN KHỐI DỮ LIỆU</name>
    			<tag>[TÊN KHỐI DỮ LIỆU]</tag>
    		</position>

    Bạn sẽ áp dụng ở đâu tùy ý bạn. Chúc thành công!

    demo chưa thêm nội dung cho các khối.

     
    Lần sửa cuối bởi một điều hành viên: 09/07/2016 18:44
    ductrung thanhchunghti thích điều này.
  • dangdinhtu

    dangdinhtu Đặng Đình Tứ

    Điều hành viên Quản trị diễn đàn

    sao thánh chèn được liên kết ngoài nhỉ cheeky

     
  • hoanglongvnpt

    hoanglongvnpt Nguyễn Tất Thắng

  • nguyentrinh

    nguyentrinh Nguyễn Tuyết Trinh

  • nguyentrinh

    nguyentrinh Nguyễn Tuyết Trinh

    chèn được link ngoài mà hẻm http://tuoitre.vn

     
    Lần sửa cuối bởi một điều hành viên: 09/07/2016 18:43
  • nguyentrinh

    nguyentrinh Nguyễn Tuyết Trinh

    ủa mà cái này làm sao ạ ? Tr xem xong :( hok hiểu luôn. hj

    Ý là chỉ cần Mở file config.ini lên và thêm

             <position>
    			<name>TÊN KHỐI DỮ LIỆU</name>
    			<tag>[TÊN KHỐI DỮ LIỆU]</tag>
    		</position>
    

    chỉ thêm phần này thôi hả anh ?

     
  • hoanglongvnpt

    hoanglongvnpt Nguyễn Tất Thắng

    Bạn muốn hiển thị bao nhiêu tabs dữ liệu thì bạn thêm bấy nhiêu:

    <position>
    			<name>TÊN KHỐI DỮ LIỆU</name>
    			<tag>[TÊN KHỐI DỮ LIỆU]</tag>
    		</position>

    Demo của mình giới thiệu là 6 cặp <position>

     
  • nguyentrinh

    nguyentrinh Nguyễn Tuyết Trinh

    file config.ini nằm ở themes/default đúng ko anh ?

     
  • hoanglongvnpt

    hoanglongvnpt Nguyễn Tất Thắng

    Đúng rồi bạn

     
  • Đông Gioăng

    Đông Gioăng Chung Bảo Ngọc

    cái block bác đang dùng này là block gì vậy ạ. Share cho em với được không ạ

     
  • hoanglongvnpt

    hoanglongvnpt Nguyễn Tất Thắng

    Làm theo hướng dẫn ở trên đi bạn.

     
  • lumina430

    lumina430 Trần Long

    Giả sử muốn có tab pháp luật, kinh tế, chính trị thì chỗ tên khối dữ liệu cũng ghi là pháp luật, kinh tế, chính trị hả anh. Em thêm rồi mà ko thấy nó hiển thị. Thêm xong có phải làm gì để nó hiển thị ko

     
  • hoanglongvnpt

    hoanglongvnpt Nguyễn Tất Thắng

    Đúng vậy bạn.

     
  • Đông Gioăng

    Đông Gioăng Chung Bảo Ngọc

    ý của em là cái block slide ở phần mỗi tab mà bác

     
    Lần sửa cuối bởi một điều hành viên: 09/07/2016 19:05
  • hoanglongvnpt

    hoanglongvnpt Nguyễn Tất Thắng

    Link tải ở đây: http://thinhweb.com/chia-se-block-slider-news-5-tin-danh-cho-website-su-dung-ma-nguon-nukeviet/

     

     
  • lumina430

    lumina430 Trần Long

    vẫn ko biết làm sao để nó hiển thị cả. Chèn code xong không thấy có thay đổi gì. Anh nói rõ hơn được không ?

     
  • hoanglongvnpt

    hoanglongvnpt Nguyễn Tất Thắng

    ID/PASS qua ibTeam

     
  • NamSon

    NamSon Trần Nam Sơn

    làm cho module shop là làm sao a,hướng dẫn e với

     
  • nguyentrinh

    nguyentrinh Nguyễn Tuyết Trinh

    Tr điền vào đây đúng ko anh ?

     
  • hoanglongvnpt

    hoanglongvnpt Nguyễn Tất Thắng

    Oái zaaaa xem trong file gốc người ta viết có dấu không à ta? kể cả font chữ nữa à ta....laugh

     

Chia sẻ trang này

Bạn đã không sử dụng Site, Bấm vào đây để duy trì trạng thái đăng nhập. Thời gian chờ: 60 giây