배너랜덤으로 노출순서를 지정하고싶습니다.

배너랜덤으로 노출순서를 지정하고싶습니다.

QA

배너랜덤으로 노출순서를 지정하고싶습니다.

답변 5

본문

아래 처럼 그누보드 (영카트) 배너를 만들었는데요

순서가 고정이 아니라. 랜덤으로 하고싶습니다. 

 


<center>    
    <a href="도메인"><img src="/bn/b_1.jpg" width=""></a>
    <a href="도메인"><img src="/bn/b-2.jpg" width=""></a>
    <a href="도메인"><img src="/bn/b_3.jpg" width=""></a></p></br>
    <a href="도메인"><img src="/bn/b_4.jpg" width=""></a>
    <a href="도메인"><img src="/bn/b_5.jpg" width=""></a>
    <a href="도메인"><img src="/bn/b_6.jpg" width=""></a></p></br>
    <a href="도메인"><img src="/bn/b_7.jpg" width=""></a>
    <a href="도메인"><img src="/bn/b_8.jpg" width=""></a>
    <a href="도메인"><img src="/bn/b_9.jpg" width=""></a></p></br>
    <a href="도메인"><img src="/bn/b_12.jpg" width=""></a>    
    <a href="도메인"><img src="/bn/b_10.jpg" width=""></a>
    <a href="도메인"><img src="/bn/b_11.jpg" width=""></a>
    </center>

이 질문에 댓글 쓰기 :

답변 5

도메인도 다를테니 도메인주소와 이미지를 배열에 넣고 shuffle 돌리는게 좋겠습니다.

 


// 배열에 담아둡니다.
$array1 = array(array('도메인1','이미지1.jpg','_blank'), array('도메인2','이미지2.jpg','_blank'), array('도메인3','이미지3.jpg','_self').........);
 
// 위 배열 숫자만큼 순서를 가지고 있는 배열을 만듭니다.
$array2 = array();
for($i=0 ; $i<count($array1) ; $i++) {
   $array2[$i] = $i;
}
// 순서배열을 섞어줍니다.
shuffle($array2);
 
// 뒤섞인 배열순서대로 배너링크를 뿌려줍니다.
for($j = 0 ; $j<count($array2) ; $j++) {
   // 배너순서
   $b_no = $array2[$j];
   // 도메인
   $domain = $array1[$b_no][0];
   // 이미지
   $img = $array1[$b_no][1];
   // 새창 또는 자체열기
   $target = $array1[$b_no][2];
 
   echo '<a href="'.$domain.'" target="'.$target.'">';
   echo '<img src="/bn/'.$img.'">';
   echo '</a>';
}

위처럼 $array1 에 다 담아두고..

순서를 저장할 $array2를 만들어서 섞고

배너 갯수만큼 for 문을 돌려서 a 태그를 만들어서 뿌려주면 되겠습니다.

 

추가로 ..

3개 배너 다음에 각각 <br> 이 들어가야 한다면..

마지막 echo '</a>'; 밑에 


$x = $j+1;
if($x % 3 == 0) echo '<br>';

을 추가해 주시면 되겠습니다.

 

테스트 안해보고 코드 작성한 거라 잘 될지 모르겠네요. 

배너 갯수가 3개라 하면

for($j = 0 ; $j<count($array2) ; $j++) {
  // 배너순서
  $b_no = $array2[$j];
  // 도메인
  $domain = $array1[$b_no][0];
  // 이미지
  $img = $array1[$b_no][1];
  // 새창 또는 자체열기
  $target = $array1[$b_no][2];
 
  echo '<a href="'.$domain.'" target="'.$target.'">';
  echo '<img src="/bn/'.$img.'">';
  echo '</a>';
}

for($j = 0 ; $j<count($array2) ; $j++) {
  // 배너순서
  $b_no = $array2[$j];
  // 도메인
  $domain = $array1[$b_no][0];
  // 이미지
  $img = $array1[$b_no][1];
  // 새창 또는 자체열기
  $target = $array1[$b_no][2];
 
  echo '<a href="'.$domain.'" target="'.$target.'">';
  echo '<img src="/bn/'.$img.'">';
  echo '</a>';
}

for($j = 0 ; $j<count($array2) ; $j++) {
  // 배너순서
  $b_no = $array2[$j];
  // 도메인
  $domain = $array1[$b_no][0];
  // 이미지
  $img = $array1[$b_no][1];
  // 새창 또는 자체열기
  $target = $array1[$b_no][2];
 
  echo '<a href="'.$domain.'" target="'.$target.'">';
  echo '<img src="/bn/'.$img.'">';
  echo '</a>';
}



이렇게 하는게맞나요 ?!


$rand_arr = array();
for ($i=1; $i<=11; $i++) {
    $rand_arr[] = $i;
}
shuffle($rand_arr); 
 
for ($j=0; $j<count($rand_arr); $j++) {
    echo "<a href='도메인'><img src='/bn/b_".$rand_arr[$j].".jpg' width=''></a>\n";
}

랜더링된 다음

자바스크립트로 섞어 봤어요

 


<center>    
    <a href="도메인"><img src="/bn/b_1.jpg" width=""></a>
    <a href="도메인"><img src="/bn/b-2.jpg" width=""></a>
    <a href="도메인"><img src="/bn/b_3.jpg" width=""></a></p></br>
    <a href="도메인"><img src="/bn/b_4.jpg" width=""></a>
    <a href="도메인"><img src="/bn/b_5.jpg" width=""></a>
    <a href="도메인"><img src="/bn/b_6.jpg" width=""></a></p></br>
    <a href="도메인"><img src="/bn/b_7.jpg" width=""></a>
    <a href="도메인"><img src="/bn/b_8.jpg" width=""></a>
    <a href="도메인"><img src="/bn/b_9.jpg" width=""></a></p></br>
    <a href="도메인"><img src="/bn/b_12.jpg" width=""></a>    
    <a href="도메인"><img src="/bn/b_10.jpg" width=""></a>
    <a href="도메인"><img src="/bn/b_11.jpg" width=""></a>
</center>
<script>
$(function() {
    var $bn = $('a:has(img[src^="/bn/"])');
    var $wp = $bn.first().parent();
    // ES6 (전개연산자, 화살표함수)
    var shuffled = [...$bn].map(a => ([Math.random(),a])).sort((a,b) => a[0]-b[0]).map(a => a[1]);
    // ES6을 지원하지 않는 IE에서
    // var shuffled = Array.prototype.slice.call($bn).map(function(a){return [Math.random(),a]}).sort(function(a,b){return a[0]-b[0]}).map(function(a){return a[1]});
    $wp.empty().append($(shuffled)).children(':nth-child(3n)').after($('<br><br>'));
});
</script>

for 문을 기본적으로 아셔야 할 듯 합니다.

for(초기값 ; 횟수 ; 증가) {

}

 

위처럼 초기값을 $i 변수에 0 으로 준 것이고  ($i = 0)
횟수는 $i<count($array1) 이라고 해서 $array1 변수에 들어있는 갯수만큼 돌린다는 의미입니다. count라는 함수는 뒤에 오는 것의 갯수를 구해줍니다.

증가는 $i++ 이라고 해서 1씩 증가시키는 거구요.

 

배너가 3개일때 for 문을 3번 사용하는게 아니고

for문 안에 3번 실행하라고 코드를 넣는거죠.

 

$array1 이라는 배열에 제가 3개를 넣었었죠? 

그럼 for문 한번으로 3번 실행된다는 뜻입니다.

for 문은 동일한 반복을 하는 작업에 쓰는 구문입니다.

 


for($i=0 ; $i<10 ; $i++) {
   echo $i*2;
   echo '<br>';
}

위 문장을 실행시키면..

0

2

4

6

..

18

이렇게 출력이 되겠네요.. 0부터 10보다 작은 9까지 10번 실행됩니다.

 

아래 코드 응용해서 작업해 보세요.

 


<?php
$a = [];
$a[] = '1,a';
$a[] = '2,b';
$a[] = '3,c';
shuffle($a);
foreach($a as $i) {
  list($x, $y) = explode(",",$i);
    echo $x,":".$y."<br>";    
}
답변을 작성하시기 전에 로그인 해주세요.
QA 내용 검색
질문등록
전체 1,284
© SIRSOFT
현재 페이지 제일 처음으로