Hướng dẫn Tổng Hợp Ebook Xenforo dành cho Newbie

kamchatka

MasterCorporal
Tham gia
14/04/2015
Bài viết
248
Được Like
162
Tình hình là thấy trong 4rum có 1 topic ebook nhưng ko có gì nay mình xin làm 1 cái topic gộp hết lại và đầy đủ đúng nghĩa dành cho người mới bắt đầu (newbie) giống ta :d
Phần 1 :
  1. cài đặt 4rum
  2. các chức năng trong xenforo về mặt cơ bản
  3. hướng dẫn cài đặt add-on , style .....
Phần 2 :
chỉnh sửa style theo phong cách của bạn , một cách đơn giản nhất
phần 3 : là seo
P/s: mình là dân gà nồi tạo topic này với mục đích chia sẽ cũng như gôm lại đóng dấu khi cần , nếu có pro nào đi ngang xin góp ý . cám ơn
 

kamchatka

MasterCorporal
Tham gia
14/04/2015
Bài viết
248
Được Like
162
1. cài đặt 4rum trên vps free openshift cho những bác chưa có dk mua hostting/vps .
mượn video của bác Giảng nha.
Tiếp theo là cài 4rum trên localhost (offline)
 

PVS

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
17,142
Được Like
12,745
Hoan nghênh tinh thần tham gia của bác ^^, hii
 
  • Like
Reactions: THB

kamchatka

MasterCorporal
Tham gia
14/04/2015
Bài viết
248
Được Like
162
Tạo Side chạy giống mamcongnghe & congngheaz
Đầu tiên các bạn cần có : [bd] Widget FrameWork và [bd] Image .
Sau khi cài xong, bạn vào List Widget tạo 1 widget mới với options như sau .
Mã:
Renderer: [bd] Image: Thread Images Carousel
Limit: 20
Widget Type: New Threads
Thumbnail Width: 235
Thumbnail Height: 250
Tiêu đề: 80
Gap (between thumbnails): 5
Visible Thumbnails: 5
Position: hook:page_container_content_top
Những cái option khác tùy chọn.
Vào Admin -> Options -> [bd] Image và set như sau
options.png

Sau đó tiếp tục vào template bdimage_widget.css thay hết bằng code này
Mã:
#widget-23 h3 { display:none; }

.bdImage_Widget_Slider_Container
{
    overflow: hidden; margin: 0 -14.3%; margin-top: -40px;
}

    .bdImage_Widget_Slider_Container .jcarousel-clip
    {
        margin: 0 auto;
        overflow: hidden;
    }

    .bdImage_Widget_Slider_Container .jcarousel-clip ul li a:first-child {

    }

    .bdImage_Widget_Slider_Container .jcarousel-clip ul li a:last-child {
  background: rgba(0, 0, 0, 0.51);
  position: absolute;
  top: 0;
  bottom: 4px;
  width: 213px;
  font-size: 15pt;
  color: #FFF;
  padding: 20px;
  text-decoration: none;
    }

    .bdImage_Widget_Slider_Container .jcarousel-prev-horizontal,
    .bdImage_Widget_Slider_Container .jcarousel-prev-horizontal:after
    {
        position: absolute;
        left: 5px;
        bottom: 0;
        width: 32px;
        height: 32px;
        cursor: pointer;
        background: transparent;
    }
    .bdImage_Widget_Slider_Container .jcarousel-next-horizontal,
    .bdImage_Widget_Slider_Container .jcarousel-next-horizontal:after
    {
        position: absolute;
        right: 5px;
        bottom: 0;
        width: 32px;
        height: 32px;
        cursor: pointer;
        background: transparent;
    }

    .bdImage_Widget_Slider_Container .jcarousel-prev-horizontal:after
    {
        content: '←';
        line-height: 15px;
        font-size: 30px;
        color: #FFF;
    }
    .bdImage_Widget_Slider_Container .jcarousel-next-horizontal:after
    {
        content: '→';
        line-height: 15px;
        font-size: 30px;
        color: #FFF;
    }

    .bdImage_Widget_Slider_Container .bx-wrapper .bx-viewport
    {
        border: 0;
    }

    .bdImage_Widget_Slider_Container .bx-wrapper img
    {
        width: 100%;
    }

.bdImage_Widget_Items
{
}
{xen:helper clearfix, '.bdImage_Widget_Items'}
    .bdImage_Widget_Items > li
    {
        float: left;
    }

.bdImage_WidgetRenderer_ThreadsTwo
    {
        display: block;
    }

    .bdImage_WidgetRenderer_ThreadsTwo .bdImage_Feature
    {
        display: block;
        float: left;
        overflow: hidden;
    }

        .bdImage_WidgetRenderer_ThreadsTwo .bdImage_Feature .text .title
        {
            width: 100%;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .bdImage_WidgetRenderer_ThreadsTwo .bdImage_Feature .text .body
        {
            text-align: justify;
        }

    .bdImage_WidgetRenderer_ThreadsTwo .bdImage_Small
    {
        display: block;
        float: none;
        overflow: hidden;
    }
       
    .bdImage_WidgetRenderer_ThreadsTwo .bdImage_Small.bdImage_SmallWithThumbnail .thumbnail
    {
        display: block;
        float: left;
    }

    .{$cssClass} .bdImage_Small.bdImage_SmallWithThumbnail .text
    {
        display: block;
        float: none;
    }
    {xen:helper clearfix, '.{$cssClass} .bdImage_Small.bdImage_SmallWithThumbnail li'}

    .bdImage_WidgetRenderer_ThreadsTwo .bdImage_Small li
    {
        border-bottom: 1px dashed @primaryLighterStill;
        display: block;
        float: none;
        overflow: hidden;
    }
    .bdImage_WidgetRenderer_ThreadsTwo .bdImage_Small li:last-child { border-bottom: 0; }

.bdImage_Widget_Grid_Container
{
    overflow: hidden;
    overflow-x: scroll;
    width: 100%;
}
ul.bdImage_Widget_Grid
{
    list-style: none;
    margin: 0;
    padding: 0;
}
{xen:helper clearfix, 'ul.bdImage_Widget_Grid'}
    .bdImage_Widget_Grid li
    {
        float: left;
    }
    .bdImage_Widget_Grid a
    {
        display: block;
    }
Nếu muốn ẩn trên mobile thì thêm code này vào cuối.
Mã:
@media (max-width:600px)
{
        .Responsive .bdImage_Widget_Slider_Container { display:none; }
}
Bạn ra ngoài forum xem nó hiện chưa. Chưa hiện thì bạn vào AdminCP -> Tools -> Rebuild Cache -> Rebuild Thread Information. Sau đó dis addon [bd] Image đi và bật lại.

nguồn MamCongNghe.Com​
 
  • Like
Reactions: THB

kieudai91

Private
Tham gia
14/12/2015
Bài viết
22
Được Like
16
bạn chủ top có file mềm về xenforo không, chủ top chia sẻ cho mọi người đi
 
  • Like
Reactions: THB

Top Bottom