random news ticker (ok)

797KB

random news-ticker-master.rar

Open

function getpostblogs() {
  ob_start();
  global $post;
  $index        = 1;
  $args         = ['numberposts' => 8];
  $custom_posts = get_posts($args);
  $data         = '';
  $data .= '<div class="row">';
  foreach ($custom_posts as $post): setup_postdata($post);
  	$attachment_id = $post->ID;
  	$image_full = wp_get_attachment_image_src( get_post_thumbnail_id(),'full');
  	$image_thubnail = wp_get_attachment_image_src( get_post_thumbnail_id(),'thubnail');
  	$linkimage1 = $image_full[0];
  	$linkimage2 = $image_thubnail[0];
    $linkp = get_permalink();
    if ($index == 1) {
      $data .= '<div class="col-xs-9 col-sm-9 col-md-9 col-lg-9 row9">';
      	$data .= '<div class="leftnews">';
		      $data .= '<a class="one" href="' . $linkp . '"><img class="lazyload" data-src="'.$linkimage1.'" alt="Image Attributes"></a>';
		      $data .= '<a class="two" href="' . $linkp . '"><h3>' . get_the_title() . '</h3></a>';
	      $data .= '</div>';
      $data .= '</div>';
      $data .= '<div class="col-xs-3 col-sm-3 col-md-3 col-lg-3 row3">';
      $data .= '<ul id="nt-example1">';
    } else {
      $data .= '<li class="postmany">';
      	$data .= '<a class="flex" href="' . $linkp . '"><img class="lazyload" data-src="'.$linkimage2.'" alt="Image Attributes"><h3>' . get_the_title() . '</h3></a>';
      $data .= '</li>';
      if ($index == 8) {
        $data .= '</ul>';
        $data .= '</div>';
      }
    }
    $index++;
  endforeach;
  wp_reset_postdata();
  $data .= '</div>';
  $data .= ob_get_contents();
  ob_end_clean();
  return $data;
}
add_shortcode('shortcodeposts', 'getpostblogs');

<div class="container titleh2">
		<h2>BÀI VIẾT MỚI NHẤT</h2>
		<div class="row">
			<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
				<?php echo do_shortcode('[shortcodeposts]'); ?>
			</div>
		</div>
	</div>

.leftnews {
  padding-top: 15px;
  position: relative;
  &:after {
    content: "";
    position: absolute;
    background-color: rgba(0, 0, 0, 0.5);
    width: 100%;
    height: calc(100% - 15px);
    top: 15px;
    left: 0;
  }
  >a {
    display: block;
    &.two {
      position: absolute;
      z-index: 1;
    color: #ffffff;
      @include translate50;
    }
    >img {
      width: 100%;
      height: 450px;
      @include objectfit;
    }
  }
  h3 {
    font-size: 30px;
  }
}
#nt-example1 {
      padding-top: 15px;
  a.flex {
    text-decoration: none;
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px dashed;
    @include flexbox;
    >img {
      height: 90px;
      width: 90px;
      margin-right: 10px;
      @include objectfit;
    }
    >h3 {
      @include flexgrow;
      font-size: 16px;
      text-align: left;
      @include para4;
    }
  }
}
.row9 {
  border-top: 1px solid #ececec;
  border-bottom: 1px solid #ececec;
  border-left: 1px solid #ececec;
}
.row3 {
  border: 1px solid #ececec;
}