Nội dung

Code Hiển thị tin tức dạng box. 1 tin to và những tin nhỏ bên cạnh trong wordpress

4 năm trước, Code theme wordpress, Phát triển website, 432 Lượt xem

xin chào các bạn hôm nay netweb.vn sẽ hướng dẫn các bạn cách code code box tin tức 1 tin to và nhiều tin nhỏ như hình dưới, tiện mình đang làm dự án viết bài luôn 😀

Code box tin tức dạng 1 tin lớn nhiều tin nhỏ

giải thích, này mình dùm biến $i đếm chạy theo vòng lặp, cho $i =1, sau khi vào vòng lặp kiểm tra, nếu phần tử đầu tiên =1 xuất ra tin to, ngược lại, xuất ra các tin nhỏ, đơn giản vậy thôi, chúc các bạn thành công…

<?php
				        $the_press = new WP_Query(array('post_type' => 'post','posts_per_page' => 5,'cat' => 1, 'paged'=> get_query_var('paged') ));
				        // The Loop
				        $i=1;
				        while ($the_press->have_posts()) : $the_press->the_post();    
				         ?>	
						
						<?php if ($i == 1) { ?> 
//tin to

						<a href="<?php echo the_permalink(); ?>" class="_item_plubgin" style="background-image: url('<?php echo get_the_post_thumbnail_url(); ?>');">
							<div class="title_plubgin">
								<?php the_title(); ?>					
							</div>
							<div class="link_label"><span>Xem thêm</span><img src="<?php echo get_template_directory_uri(); ?>/img/next-white.png" alt=""></div>
						</a>


						<?php } else { ?>
//tin nho


				 	
                        <div class="_item_plubgin_sm">
						<a href="<?php echo the_permalink(); ?>" class="_left_sm" style="background-image: url('<?php echo get_the_post_thumbnail_url(); ?>');"></a>
						<div class="_right_sm">
							<div class="title_plubgin_sm">
								<?php the_title(); ?>						
							</div>
							<a href="<?php echo the_permalink(); ?>" class="link_label"><span>Xem thêm</span><img src="<?php echo get_template_directory_uri(); ?>/img/next-black.png" alt=""></a>
						</div>
						</div>
	
						<?php } ?>
						<?php $i++; ?>
						<?php endwhile; ?>         
						<?php wp_reset_postdata();?>

 

 

Bài viết mới cập nhập

  • Hướng dẫn Plugin floating contact

    Hướng dẫn Plugin floating contact

    1 năm trước, 380 Lượt xem

    Netweb xin hướng dẫn cách quản lý Plugin floating contact các bạn nhớ làm theo kỹ tường bước để plugin hoạt động Tính năng: Hiển…

  • Backup Yandex Mail

    Backup Yandex Mail

    1 năm trước, 251 Lượt xem

    Khác với dịch vụ email theo tên của microsoft và google với chi phí đắt đỏ tầm 1tr/năm/1user, vì thế nên netweb khuyên dùng dịch…

Bình luận trên facebook netweb.vn

Gọi netweb Báo giá web Chát Zalo
Chủ đề liên quan theo Tag
, , ,

Đam mê thiết kế web, kinh nghiệm 9 năm trong nghề thiết kế website, đang thiết kế web dạo tại netweb.vn, Callme: 08.9898.2526 (Mr Hải)