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

2 năm trước, Code theme wordpress, Phát triển website, 189 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

  • Quản lý mẫu web công ty

    Quản lý mẫu web công ty

    2 tháng trước, 157 Lượt xem

    Xin chào tất cả các khách hàng dùng mẫu web công ty bên netweb, sau đây netweb.vn xin hướng dẫn các bạn quản lý mẫu…

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

Đ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)