ข่าวประชาสัมพันธ์

มาร่วมเป็นกำลังใจให้เว็บด้วยการสมัครสมาชิกวีไอพี ~~ เลือกปีที่ท่านต้องการได้โดยไม่ต้องเรียงปี ~~ ปีละ 350 บาท สมัคร 2 ปีลดเหลือ 600 บาท ~~ มีไลน์กลุ่ม VIP จำนวนหลายร้อยท่าน เอาไว้ปรึกษางานซ่อม ~~ เข้าถึงข้อมูลด้านเทคนิค ข้อมูลเชิงลึกมากมาย.....


ผู้เขียน หัวข้อ: วิธีการดึงรูปพร้อมหัวข้อกระทู้มาแสดงที่หน้าแรกจากบอร์ดที่กำหนด  (อ่าน 4047 ครั้ง)

0 สมาชิก และ 1 บุคคลทั่วไป กำลังดูหัวข้อนี้

ออฟไลน์ Auto Man

  • Administrator
  • หัวหน้าศูนย์ซ่อมสร้าง
  • *****
  • เจ้าของกระทู้
  • Joined: ก.ย. 2558
  • กระทู้: 37406
  • สมาชิกลำดับที่ : 1
  • เพศ: ชาย
  • มือผู้ให้ย่อมสูงกว่ามือผู้รับ
    • เว็บชุมชนคนรักช่างยนต์
    • อีเมล์
  กำลังหาวิธีการแนะนำคู่มือการซ่อมล่าสุด สัก 5-6 เรื่อง มาแสดงที่หน้าแรก
เพื่อนสมาชิกเว็บจะได้เข้าถึงข้อมูลคู่มือการซ่อมล่าสุดของเว็บได้ง่ายขึ้น ประมาณนั้น

  แหล่งข้อมูล => http://www.thaiseoboard.com/index.php?topic=375548.0
ลิ้งค์สำรอง => http://www.thaiseoboard.com/index.php/topic,355815.0.html
อีก => http://www.thaiseoboard.com/index.php/topic,280856.0.html

  มันต้องได้สักอันล่ะ http://www.thaiseoboard.com/index.php/topic,186333.0.html

อันนี้ล่าสุด สไตล์ โซนไอที -> https://www.forum.coolhostplus.net/index.php/topic,102.0.html
(11 มีนา 63)

  หน้าตาประมาณนี้ แต่ว่าไม่ใช่ม้านะ เป็นหน้าตาคู่มือการซ่อม 5 5 5

ตรงนี้มีภาพ! แต่ท่านจะมองไม่เห็น , ท่านต้อง  สมัครสมาชิก หรือ ลงชื่อเข้าระบบ

« แก้ไขครั้งสุดท้าย: 11 มีนาคม 2563, 08:13:24 โดย Auto Man »
สวัสดีคุณ...ผู้เยี่ยมชม  กด ❤ ถูกใจโพสท์นี้ หรือยัง...
ต้องการสมัครสมาชิก VIP สมัครได้ที่นี่...   หรือทาง Line ID: k.sonchai

ออฟไลน์ Auto Man

  • Administrator
  • หัวหน้าศูนย์ซ่อมสร้าง
  • *****
  • เจ้าของกระทู้
  • Joined: ก.ย. 2558
  • กระทู้: 37406
  • สมาชิกลำดับที่ : 1
  • เพศ: ชาย
  • มือผู้ให้ย่อมสูงกว่ามือผู้รับ
    • เว็บชุมชนคนรักช่างยนต์
    • อีเมล์
  ลองดูครับ
ไฟล์ BoardIndex.template.php ครับผม เวอร์ชั่น 2.0.11

แทรกไว้ก่อน ?>

โค๊ด: [Select]
function findIMG($text){
   preg_match_all('/\[img\].*?\[\/img\]/i',$text,$page);
   foreach($page as $value)
      $src = substr($value[0],5);
   $src = substr($src,0,-6);
   return($src);
}

function ssi_pic($num_top = 12,$order,$board){
   global $db_prefix, $scripturl, $smcFunc;
   $request = $smcFunc['db_query']('', '
      SELECT t.id_topic,m.body,m.subject
      FROM {db_prefix}messages m,{db_prefix}topics t
      WHERE t.id_first_msg=m.id_msg AND t.id_board='.$board.'
      ORDER BY t.'.$order.' DESC
      LIMIT '.$num_top,
      array(
      )
   );
   $posts = array();
   while ($row = $smcFunc['db_fetch_assoc']($request))
   {
      // Build the array.
      $topics[] = array(
         'id' => $row['id_topic'],
         'body' => $row['body'],
         'subject' => $row['subject']
      );
   }
   $smcFunc['db_free_result']($request);
   foreach ($topics as $data){
      $topic = "index.php?topic=".$data['id'].".0";
      $srcPic = findIMG($data['body']);
      $subject = $data['subject'];

      if($srcPic ==''){

         echo '<div class="boxpGal">
         <div class="picpGal"><a href="'.$topic.'" title="'.$subject.'" target="_blank"><img src="http://เวปของคุณ/Themes/default/images/noimage.jpg" width="220" height="146" alt="" /><p>'.$subject.'</p>[/url]</div>
      </div>';
      }else{   
      echo '<div class="boxpGal">
         <div class="picpGal"><a href="'.$topic.'" title="'.$subject.'" target="_blank"><img src="'.$srcPic.'" width="220" height="146" alt="" /><p>'.$subject.'</p>[/url]</div>
      </div>';
      }
   }
}

ส่วนโค๊ดนี้ ไฟล์เดียวกันครับ แทรกไว้ตรงที่อยากจะแทรกครับ

โค๊ด: [Select]
   echo'<div class="cat_bar">
<h3 class="catbg">สินค้า และ ร้านค้าใหม่ ล่าสุด</h3></div>';
echo''.ssi_pic(6,'ID_TOPIC',array(34,35,36)).'';


6 คือรูปหรือโพสต์ที่อยากให้โชว์ในหน้าแรกครับ
34,35,36 คือไอดีของบอร์ดที่ต้องการดึงมาแสดงครับ

ไฟล์ index.css (ในธีมที่คุณใช้อยู่ครับ) ต่อท้ายเลยครับ
โค๊ด: [Select]
.boxpGal {
   background-color: rgba(255, 255, 255, 0);
   float: left;
   height: 180;
   width: 150px;
   margin: 5px;
}
« แก้ไขครั้งสุดท้าย: 01 มีนาคม 2563, 11:17:52 โดย Auto Man »
สวัสดีคุณ...ผู้เยี่ยมชม  กด ❤ ถูกใจโพสท์นี้ หรือยัง...
ต้องการสมัครสมาชิก VIP สมัครได้ที่นี่...   หรือทาง Line ID: k.sonchai

ออฟไลน์ Auto Man

  • Administrator
  • หัวหน้าศูนย์ซ่อมสร้าง
  • *****
  • เจ้าของกระทู้
  • Joined: ก.ย. 2558
  • กระทู้: 37406
  • สมาชิกลำดับที่ : 1
  • เพศ: ชาย
  • มือผู้ให้ย่อมสูงกว่ามือผู้รับ
    • เว็บชุมชนคนรักช่างยนต์
    • อีเมล์
   
อ้างถึง
raykung
ฟังก์ชั่น findIMG ใช้ดึงภาพจาก tag ของ [ img]..[ /img] แรกของกระทู้นั้นๆ ครับ (ดึงภาพแรกของกระทู้)
โดยดึงจากข้อความในส่วนของ body นะ มันจะแยกให้ว่าภาพแรกของกระทู้คือลิงก์อะไรโดยใช้คำสั่ง preg_match_all

แต่ฟังก์ชั่นนี้มันมี bug อยู่ตรงที่ tag ของ [ img] มันใส่ parameter เพิ่มเติมได้เช่น alt, width, height
เช่น [ img width="80"]..[ /img] มันจะใช้งานกับฟังก์ชั่น findIMG ไม่ได้

ส่วนฟังก์ชั่น ssi_pic ถ้าคุณกำหนด Order โดย 'ID_TOPIC' จะเป็นการดึงกระทู้ล่าสุดของ Board ที่เลือกมา
แล้วก็วนลูปไปเอา Id, รูป, ชื่อกระทู้ มาแสดง แต่ถ้าในกระทู้นั้นไม่มีรูปอยู่ (ไม่มีการใช้งาน [ img]...[ /img])
มันจะไปเอารูป http://www.post-nook.com/forum...es/default/images/NO_IMAGE.png  มาแสดงแทน

อ้างถึง
TaLonTour
.boxpGal{
    background-color: #ffffff;
   padding:3px;
   float:left;
   width:174px;
   height:180px;
}
.picpGal{
   padding:2px;
   height:130px;
   overflow:hidden;
   border:1px #CCC dotted;
}

ลองใล่ปรับดูนะครับ  อันนี้ที่ผมปรับ

ตรงนี้มีภาพ! แต่ท่านจะมองไม่เห็น , ท่านต้อง  สมัครสมาชิก หรือ ลงชื่อเข้าระบบ
« แก้ไขครั้งสุดท้าย: 01 มีนาคม 2563, 11:21:37 โดย Auto Man »
สวัสดีคุณ...ผู้เยี่ยมชม  กด ❤ ถูกใจโพสท์นี้ หรือยัง...
ต้องการสมัครสมาชิก VIP สมัครได้ที่นี่...   หรือทาง Line ID: k.sonchai


ออฟไลน์ Auto Man

  • Administrator
  • หัวหน้าศูนย์ซ่อมสร้าง
  • *****
  • เจ้าของกระทู้
  • Joined: ก.ย. 2558
  • กระทู้: 37406
  • สมาชิกลำดับที่ : 1
  • เพศ: ชาย
  • มือผู้ให้ย่อมสูงกว่ามือผู้รับ
    • เว็บชุมชนคนรักช่างยนต์
    • อีเมล์
สวัสดีคุณ...ผู้เยี่ยมชม  กด ❤ ถูกใจโพสท์นี้ หรือยัง...
ต้องการสมัครสมาชิก VIP สมัครได้ที่นี่...   หรือทาง Line ID: k.sonchai

ออฟไลน์ Auto Man

  • Administrator
  • หัวหน้าศูนย์ซ่อมสร้าง
  • *****
  • เจ้าของกระทู้
  • Joined: ก.ย. 2558
  • กระทู้: 37406
  • สมาชิกลำดับที่ : 1
  • เพศ: ชาย
  • มือผู้ให้ย่อมสูงกว่ามือผู้รับ
    • เว็บชุมชนคนรักช่างยนต์
    • อีเมล์
« แก้ไขครั้งสุดท้าย: 01 มีนาคม 2563, 13:29:04 โดย Auto Man »
สวัสดีคุณ...ผู้เยี่ยมชม  กด ❤ ถูกใจโพสท์นี้ หรือยัง...
ต้องการสมัครสมาชิก VIP สมัครได้ที่นี่...   หรือทาง Line ID: k.sonchai

ออฟไลน์ Auto Man

  • Administrator
  • หัวหน้าศูนย์ซ่อมสร้าง
  • *****
  • เจ้าของกระทู้
  • Joined: ก.ย. 2558
  • กระทู้: 37406
  • สมาชิกลำดับที่ : 1
  • เพศ: ชาย
  • มือผู้ให้ย่อมสูงกว่ามือผู้รับ
    • เว็บชุมชนคนรักช่างยนต์
    • อีเมล์
สวัสดีคุณ...ผู้เยี่ยมชม  กด ❤ ถูกใจโพสท์นี้ หรือยัง...
ต้องการสมัครสมาชิก VIP สมัครได้ที่นี่...   หรือทาง Line ID: k.sonchai

ออฟไลน์ Auto Man

  • Administrator
  • หัวหน้าศูนย์ซ่อมสร้าง
  • *****
  • เจ้าของกระทู้
  • Joined: ก.ย. 2558
  • กระทู้: 37406
  • สมาชิกลำดับที่ : 1
  • เพศ: ชาย
  • มือผู้ให้ย่อมสูงกว่ามือผู้รับ
    • เว็บชุมชนคนรักช่างยนต์
    • อีเมล์
  ต้องย้อนไปศึกษาเรื่อง <div></div>
https://www.beanthemes.com/knowledge/basic-div-html/

ตัวอย่างโค้ด แบบใส่ค่าตรง ใน div
โค๊ด: [Select]
<div style="color: red;">
     Your Text
</div>

ตัวอย่างโค้ด ใส่ id หรือ class เพื่อใช้อ้างอิงกับการจัด CSS

ใน html
โค๊ด: [Select]
<div class="red">
     Your Text
</div>

ใน CSS
โค๊ด: [Select]
.red{
     color: red;
}

ตามตัวอย่าง ตัวหนังสือคำว่า Your Text ก็จะแสดงผลเป็นสีแดงเช่นเดียวกับแบบแรก ซึ่งวิธีการหลังจะเป็นวิธีการที่ได้รับความนิยมมากกว่า เนื่องจากง่ายต่อการแก้ไขในภายหลังนั้นเอง
สวัสดีคุณ...ผู้เยี่ยมชม  กด ❤ ถูกใจโพสท์นี้ หรือยัง...
ต้องการสมัครสมาชิก VIP สมัครได้ที่นี่...   หรือทาง Line ID: k.sonchai

ออฟไลน์ Auto Man

  • Administrator
  • หัวหน้าศูนย์ซ่อมสร้าง
  • *****
  • เจ้าของกระทู้
  • Joined: ก.ย. 2558
  • กระทู้: 37406
  • สมาชิกลำดับที่ : 1
  • เพศ: ชาย
  • มือผู้ให้ย่อมสูงกว่ามือผู้รับ
    • เว็บชุมชนคนรักช่างยนต์
    • อีเมล์
   HTML : เขียนเว็บไซต์ด้วยแท็ก Div 
ทำความรู้จักกับ tag div
tag div เป็นการแสดงข้อมูลหรือรูปแบบเป็นลักษณะเป็นบล็อกๆ

เปรียบเทียบ tag div กับ table
1.div ส่วนใหญ่ใช้กำหนดเป็นกรอบของข้อมูล สามารถใช้ css เข้ามาจัดการตำแหน่ง  ซ้าย ขวา ล่าง หรือจะให้ลอยก็ได้ ส่วนการโหลดข้อมูล แต่ละข้อมูลใน div จะแบ่งแยกกันโหลด

2.table ส่วนมากแล้วจะนำไปใช้กับข้อมูลที่จัดเป็นรูปแบบของตาราง เป็นช่องๆ ส่วนการโหลดข้อมูล มันจะรอให้ข้อมูลภายในช่องต่างๆโหลดให้เสร็จทั้งหมดก่อน มันถึงจะแสดงข้อมูลทั้งตารางออกมาให้เห็น

ข้อดีในการใช้ tag div
1. div มีความยืดหยุ่นในการจัดหน้าเว็บ มากกว่าการใช้ Table

2. Table จะแสดงผลเนื้อหาได้ก็ต่อเมื่อโหลดจบแท็กแล้ว (</table>)

3. ตกแต่งรูปแบบได้หลากหลายกว่า เมื่อใช้ร่วมกับ css

4.ไฟล์ที่ใช้ Div มีขนาดเล็กกว่า
 

ตัวอย่าง code ที่ใช้ div

โค๊ด: [Select]
<?
    if($level_arry[$i] == 'A1' || $_SESSION['name'] == "administrator") {
    ?>
    <div id = "cpanel">
        <div style = "float:left;">
             <div class="icon">
                 <a href="index2.php?option=addusermac"> <img src="images/student1.jpg" alt="เพิ่มผู้ใช้งานใหม่ประเภทนักศึกษา" width="54" height="54" border="0" align="middle" />
                      <span>เพิ่มผู้ใช้นักศึกษา</span>MAC
                  [/url]
              </div>
        </div>
    </div>
   
   

    <?
    }
    ?>


ผลที่ได้

ตรงนี้มีภาพ! แต่ท่านจะมองไม่เห็น , ท่านต้อง  สมัครสมาชิก หรือ ลงชื่อเข้าระบบ


ที่มา...
« แก้ไขครั้งสุดท้าย: 11 มีนาคม 2563, 16:36:30 โดย Auto Man »
สวัสดีคุณ...ผู้เยี่ยมชม  กด ❤ ถูกใจโพสท์นี้ หรือยัง...
ต้องการสมัครสมาชิก VIP สมัครได้ที่นี่...   หรือทาง Line ID: k.sonchai

ออฟไลน์ Auto Man

  • Administrator
  • หัวหน้าศูนย์ซ่อมสร้าง
  • *****
  • เจ้าของกระทู้
  • Joined: ก.ย. 2558
  • กระทู้: 37406
  • สมาชิกลำดับที่ : 1
  • เพศ: ชาย
  • มือผู้ให้ย่อมสูงกว่ามือผู้รับ
    • เว็บชุมชนคนรักช่างยนต์
    • อีเมล์
  เว็บนี้เข้าท่าดีแฮะ...

- การวางเลย์เอาท์ (Layout) ด้วยวิธีต่างๆใน CSS

ในช่วงก่อนๆนั้นการวาง Layout มักจะใช้คำสั่ง Table ในการจัดวาง เพื่อออกแบบเค้าโครงของหน้าเว็บเพจ หรือทั้งเว็บไซต์ วิธีการนี้เพียงแค่เราเข้าใจคำสั่งที่เกี่ยวกับตาราง (Table) อันได้แก่ table , tr , td เป็นต้น ก็จะสามารถสร้างหรือออกแบบโครงสร้าง หรือเลย์เอาท์
(Layout) ได้ดั่งใจ
                 
  ตรงนี้มีภาพ! แต่ท่านจะมองไม่เห็น , ท่านต้อง  สมัครสมาชิก หรือ ลงชื่อเข้าระบบ

 
แต่ปัญหาคือเมื่อเพจนั้นถูกเปิดขึ้น มันจะแสดงเนื้อหาหลังจากที่โหลด Table เสร็จเสิ้น หรือจะอ่านขึ้นมูลจากด้านบนลงสู่ด้านล่าง และการใช้ Table ในการจัด Layout ทำให้ใช้เวลาในการโหลดหน้าเว็บพอสมควร เว็บโปรแกรมเมอร์ส่วนใหญ่จึงหันมาใช้แท็กง่ายๆอย่างแท็ก DIV หรือแท็ก P แทน และใช้ CSS ในการกำหนดว่าจะใช้บล็อกไหนเป็น Header บล็อกไหนเป็น Footer ดังภาพ
ใช้ DIV & CSS ในการจัดวาง Layout
วิธีการนี้เป็นการจัดวางเลย์เอาท์(layout)เพื่อออกแบบเว็บไซต์ที่เป็นที่นิยมในปัจจุบัน โดยวิธีการนี้เราจะใช้ DIV Tag ในภาษา HTML ทั้งหน้าเว็บเพจ จากนั้นจึงใช้ CSS ในการกำหนดหรือจัดวางเลย์เอาท์ได้ตามใจเรา

ตัวอย่าง layout_design.html
โค๊ด: [Select]
<html>
<head>
<link type="text/css" rel="stylesheet" href="css_layout.css">
</head>
<body>
<div id="all">
    <div id="header"><h1>CSS&amp;HTML&nbsp;Layout</h1></div>
    <div id="left">This is left side.   
    </div> 
     <div id="content">
           <p>การจัดวางโครงสร้าง (Layout) ของเว็บ ถือเป็นจุดเริ่มต้นและจุดสำคัญมากในการออกแบบ ก่อนที่จะสร้างส่วนอื่นๆ เว็บโปรแกรมเมอร์ส่วนใหญ่มักออกแบบเค้าโครงของเว็บเพจไว้ก่อนเสมอ จากนั้นจึงกำหนดโครงสร้างอื่นๆต่อไป
            </p>
            <p>ตัวอย่างนี้ผู้เขียนได้ออกแบบ Layout อย่างคร่าวๆ โดยใช้แท็ก DIV ใน HTML พร้อมกับใช้ CSS ในการจัดการให้ข้อมูลออกมาในรูปแบบที่ต้องการ
            </p>
       </div>
       <div id="right">This is right side.</div>
       <div id="footer">This is footer</div>
</div>
</body>
</html>

ผลลัพธ์ที่ได้เมื่อยังไม่มีคำสั่ง CSS ที่เอาไว้ควบคุมลักษณะ หรือการจัดวางเลย์เอาท์ต่างๆ จะแสดงเพียงแค่ text ข้อความธรรมดาเมื่อรันผ่านแต่ละบราวเซอร์ ดังภาพ
 
ตรงนี้มีภาพ! แต่ท่านจะมองไม่เห็น , ท่านต้อง  สมัครสมาชิก หรือ ลงชื่อเข้าระบบ


ขั้นตอนต่อไปเป็นการสร้างไฟล์ CSS อีก 1 ไฟล์ (แทรกแบบ External) โดยมีชื่อไฟล์ว่า css_layout.css ดังนี้
 
 ตัวอย่าง css_layout.css
โค๊ด: [Select]
* { margin: 0; padding: 0; }
#all{ width:980px; height:100%; margin:0px auto; position:relative; }
#header{ background-color:#ec8000; height:100px; padding:8px; }
#left{ background-color:#80ec00; height:100%; width:200px; position:absolute;}
#content{ position:absolute; margin:0 250px 0 200px; padding:8px; }
#right{ background-color:#8080ec; height:100%; width:250px; position:absolute; right:0; }
#footer{ position:absolute; background-color:#808080; height:100px; text-align:center; bottom:-120px; width:100%; }

ผลลัพธ์ที่ได้จะเป็นการจัดเลย์เอาท์ (Layout) โดยแบ่งเป็น Header , Left side , Right side , Content และ Footer ดังภาพ

ตรงนี้มีภาพ! แต่ท่านจะมองไม่เห็น , ท่านต้อง  สมัครสมาชิก หรือ ลงชื่อเข้าระบบ

 
หวังว่านักศึกษาทุกท่านคงพอจะเข้าใจในบทนี้ ผู้เขียนต้องการจะสื่อให้เห็นว่าในการจัดวางเลย์เอาท์ในปัจจุบันไม่ควรใช้ Table หรือให้พยายามใช้แท็ก DIV ใน HTML แทน เพราะข้อดีที่สำคัญคือทำให้เว็บโหลดได้เร็วขึ้น ซึ่ง CSS กับ HTML ทุกวันนี้สามารถประยุกต์ใช้งานได้อย่างกว้างขวางมากกว่า
อย่างไรก็ตามขึ้นอยู่กับนักออกแบบเองว่าควรเลือกใช้ TAG ใด หรือจะออกแบบให้ Layout มีความสวยงามแตกต่างกับเว็บไซต์อื่นๆอย่างไร ซึ่งตรงจุดนี้ก็เป็นความสามารถเฉพาะของนักออกแบบและพัฒนาซอฟแวร์
สวัสดีคุณ...ผู้เยี่ยมชม  กด ❤ ถูกใจโพสท์นี้ หรือยัง...
ต้องการสมัครสมาชิก VIP สมัครได้ที่นี่...   หรือทาง Line ID: k.sonchai

ออฟไลน์ Auto Man

  • Administrator
  • หัวหน้าศูนย์ซ่อมสร้าง
  • *****
  • เจ้าของกระทู้
  • Joined: ก.ย. 2558
  • กระทู้: 37406
  • สมาชิกลำดับที่ : 1
  • เพศ: ชาย
  • มือผู้ให้ย่อมสูงกว่ามือผู้รับ
    • เว็บชุมชนคนรักช่างยนต์
    • อีเมล์
  ฝากไว้ก่อน Tag <div> 5 5 5
สวัสดีคุณ...ผู้เยี่ยมชม  กด ❤ ถูกใจโพสท์นี้ หรือยัง...
ต้องการสมัครสมาชิก VIP สมัครได้ที่นี่...   หรือทาง Line ID: k.sonchai

ออฟไลน์ Auto Man

  • Administrator
  • หัวหน้าศูนย์ซ่อมสร้าง
  • *****
  • เจ้าของกระทู้
  • Joined: ก.ย. 2558
  • กระทู้: 37406
  • สมาชิกลำดับที่ : 1
  • เพศ: ชาย
  • มือผู้ให้ย่อมสูงกว่ามือผู้รับ
    • เว็บชุมชนคนรักช่างยนต์
    • อีเมล์
     น่าจะพอได้แล้วล่ะ  เลยเอาไปใช้ในเบื้องต้นก่อน
ซึ่งยังไม่ลงจุดที่ต้องการสักเท่าไหร่

   เลยไปโพสต์ถามที่ Thai SEO Board
ได้คำแนะนำมา

อ้างถึง
เขียนแยกไฟล์แล้วดึงผ่าน iframe มาแสดงครับ

สร้างไฟล์ใหม่ขึ้นมา แล้ว include 'SSI.php'; ตาม path
เช่นสร้าวไฟล์ new-topic.php

<?php
include 'SSI.php';

โค้ดต่างๆ ...............
?>

เวลาเรียกใช้งานก็ <iframe src="doamin[dot]com/new-topic.php"></iframe> เป็นต้นครับ
« แก้ไขครั้งสุดท้าย: 08 มีนาคม 2563, 16:59:57 โดย Auto Man »
สวัสดีคุณ...ผู้เยี่ยมชม  กด ❤ ถูกใจโพสท์นี้ หรือยัง...
ต้องการสมัครสมาชิก VIP สมัครได้ที่นี่...   หรือทาง Line ID: k.sonchai

ออฟไลน์ Auto Man

  • Administrator
  • หัวหน้าศูนย์ซ่อมสร้าง
  • *****
  • เจ้าของกระทู้
  • Joined: ก.ย. 2558
  • กระทู้: 37406
  • สมาชิกลำดับที่ : 1
  • เพศ: ชาย
  • มือผู้ให้ย่อมสูงกว่ามือผู้รับ
    • เว็บชุมชนคนรักช่างยนต์
    • อีเมล์
ไฟล์ new-ad.php
โค๊ด: [Select]
<?
  include ('SSI.php');
function findIMG($text){
   preg_match_all('/\[img\].*?\[\/img\]/i',$text,$page);
   foreach($page as $value)
      $src = substr($value[0],5);
   $src = substr($src,0,-6);
   return($src);
}
function ssi_pic($num_top = 12,$order,$board = array()){
   global $db_prefix, $scripturl, $smcFunc;
   $request = $smcFunc['db_query']('', '
      SELECT t.id_topic,m.body,m.subject
      FROM {db_prefix}messages m,{db_prefix}topics t
      WHERE t.id_first_msg=m.id_msg AND t.id_board IN('. implode(',',$board) .')
      ORDER BY t.'.$order.' DESC
      LIMIT '.$num_top,
      array(
      )
   );
   $posts = array();
   while ($row = $smcFunc['db_fetch_assoc']($request))
   {
      // Build the array.
      $topics[] = array(
         'id' => $row['id_topic'],
         'body' => $row['body'],
         'subject' => $row['subject']
      );
   }
   $smcFunc['db_free_result']($request);
   foreach ($topics as $data){
      $topic = "index.php?topic=".$data['id'];
      $srcPic = findIMG($data['body']);
      $subject = $data['subject'];

   
      echo '<div class="boxpGal">
         <div class="picpGal"><a href="'.$srcPic.'" title="คลิ๊กเพื่อดูภาพเต็ม."><img src="'.$srcPic.'" width="150" alt="" />[/url]</div><center>'.mb_substr($subject,0,20,'UTF-8').'</center>
         <div class="viewAllpic"><a href="'.$topic.'" target="_blank"><font color="#0000FF">อ่านเพิ่มเติม...</font>[/url]</div>   
      </div>';
   }
}
     echo'<div class="cat_bar">
<h3 class="catbg">คู่มือการซ่อม และวายริ่งรถยนต์ ล่าสุด...</h3></div>';
echo''.ssi_pic(6,'ID_TOPIC', array(25,436,656,739)).'';
?>
สวัสดีคุณ...ผู้เยี่ยมชม  กด ❤ ถูกใจโพสท์นี้ หรือยัง...
ต้องการสมัครสมาชิก VIP สมัครได้ที่นี่...   หรือทาง Line ID: k.sonchai

ออฟไลน์ Auto Man

  • Administrator
  • หัวหน้าศูนย์ซ่อมสร้าง
  • *****
  • เจ้าของกระทู้
  • Joined: ก.ย. 2558
  • กระทู้: 37406
  • สมาชิกลำดับที่ : 1
  • เพศ: ชาย
  • มือผู้ให้ย่อมสูงกว่ามือผู้รับ
    • เว็บชุมชนคนรักช่างยนต์
    • อีเมล์
สวัสดีคุณ...ผู้เยี่ยมชม  กด ❤ ถูกใจโพสท์นี้ หรือยัง...
ต้องการสมัครสมาชิก VIP สมัครได้ที่นี่...   หรือทาง Line ID: k.sonchai

ออฟไลน์ Auto Man

  • Administrator
  • หัวหน้าศูนย์ซ่อมสร้าง
  • *****
  • เจ้าของกระทู้
  • Joined: ก.ย. 2558
  • กระทู้: 37406
  • สมาชิกลำดับที่ : 1
  • เพศ: ชาย
  • มือผู้ให้ย่อมสูงกว่ามือผู้รับ
    • เว็บชุมชนคนรักช่างยนต์
    • อีเมล์
สวัสดีคุณ...ผู้เยี่ยมชม  กด ❤ ถูกใจโพสท์นี้ หรือยัง...
ต้องการสมัครสมาชิก VIP สมัครได้ที่นี่...   หรือทาง Line ID: k.sonchai

ออฟไลน์ Auto Man

  • Administrator
  • หัวหน้าศูนย์ซ่อมสร้าง
  • *****
  • เจ้าของกระทู้
  • Joined: ก.ย. 2558
  • กระทู้: 37406
  • สมาชิกลำดับที่ : 1
  • เพศ: ชาย
  • มือผู้ให้ย่อมสูงกว่ามือผู้รับ
    • เว็บชุมชนคนรักช่างยนต์
    • อีเมล์
 จากบอร์ดไทยเสียว เอ๊ย... Thai SEO Board
ได้ความว่า
อ้างถึง
ถ้าเอาง่ายๆ สะดวกๆ ก็ tag table ครับ
https://www.w3schools.com/css/css_table.asp

ถ้าพอมีความรู้เรื่อง css แนะนำเขียนแบบ flexbox ครับ
https://www.w3schools.com/css/css3_flexbox.asp

เพิ่มเติมคือแบบ flexbox จัดการเรื่อง responsive ง่ายกว่า table ครับ
สวัสดีคุณ...ผู้เยี่ยมชม  กด ❤ ถูกใจโพสท์นี้ หรือยัง...
ต้องการสมัครสมาชิก VIP สมัครได้ที่นี่...   หรือทาง Line ID: k.sonchai