วันเสาร์ที่ 11 มิถุนายน พ.ศ. 2559

การ Redirect 301 จาก abc.com เป็น www.abc.com

วันนี้จะมาเขียนกันลืมเก็บไว้เกี่ยวกับการ Redirect 301 ของเว็บไซต์ แบบ non-www ไปเป็นแบบ www
แล้วไอ้คำว่า Redirect301 นั้นก็หมายถึงจะนำค่าลิงค์ หรือ backlink ต่างๆ ของเรื่อง seo มั้ง (ผม seo แบบงูๆ ปลาๆ หน่ะ ไม่รู้จะอธิบายยังไง) ทำเว็บใหม่ทีไร มันจะเป็ดหน้าเว็บได้ 2 version ครับ 


  • fashion2lady.com
  • www.fashion2lady.com



เข้าเว็บแบบ non-www

เข้าเว็บแบบ www

จริงๆ แล้ว เซิจเอนจิน บางตัวมันมองไปเป็นคนละเว็บเลยนะครับ (แต่กระจอกมากสำหรับพี่ Google ครับ) แต่ทำเถอะครับไม่เสียหายง่ายๆ เลย

วิธีแก้ให้มันวิ่งไปที่หน้าแบบมี www อย่างเดียวทั้งเว็บมีแค่สองบรรทัดเท่านั้นเองครับ
ลองแก้ตามดู
1. เข้าไปที่ ftp ของเว็บ หาไฟล์ .htaccess (ส่วนใหญ่อยู่ path เดียวกับ index)
2. เปิดไฟล์เพื่อแก้ไข
3. เพิ่มตามด้านล่างเลยครับ

RewriteCond %{http_host} ^fashion2lady\.com$ [NC]
RewriteRule ^(.*)$ http://www.fashion2lady.com/$1 [R=301,L]

ตัวอักษรสีแดงก็คือชื่อเว็บของเราที่ต้องการเปลี่ยนครับ
และอีกอย่างนึงคือ หากให้หน้า fashion2lady.com/index.php เปลี่ยนเป็น www.fashion2lady.com/ เพื่อกันการ Duplicate ข้อมูลกันเองภายในเว็บไซต์ ให้เพิ่มไอ้นี่ไปอีกบรรทัดครับ

RewriteRule  ^index.php$ http://www.fashion2lady.com/ [R=301,L]


จบแล้วครับ สุดท้ายนี้
หากเราพิมพ์ fashion2lady.com ลงไป มันก็จะกลายเป็น www.fashion2lady ในช่อง address ทันทีครับ


วันพฤหัสบดีที่ 9 มิถุนายน พ.ศ. 2559

จัดภาพให้กึ่งกลาง ง่ายๆ แต่ปวดกบาลครับ

ตามหัวข้อเลยครับ วันก่อนลองทำเว็บนึงดู ปรากฏว่า ต้องจัดภาพ <img> ให้อยู่กึ่งกลาง <div> ก็ไม่มีอะไรมากครับ จัดไปเลยลวกจิ้มเลยครับ

<div style="text-align:center;height:555px;">
      <img src="picture.jpg" />
</div>

มันก็กึ่งกลางนะครับ แต่เจ้ากรรม รอบนี้มันดันมีความสูงเข้ามาเกี่ยวข้องด้วยครับ ทำไงดีวะเนี่ย (height:555px;) มันกึ่งกลางแค่ซ้าย-ขวา แต่บน-ล่างมันดันไม่กึ่งกลางครับ ผมก็เลยไปหาวิธีมามากมาย หลายๆ เว็บ คือที่ต้องบอกว่ามากมายเพราะ ผมชอบโค๊ดอะไรที่มันง่ายๆ บรรทัดน้อยๆ อย่างว่าละครับ ขี้เกียจแถมความจำสั้นอีกต่างหาก เลยเอามาแปะไว้หน่อยกันลืม สำหรับคนที่ต้องการจะให้รูปภาพมันอยู่ตรงกลาง ทั้งบนล่างซ้ายขวาครับ แล้วจะบอกว่าวิธีนี้ใช้งานได้กับงานเว็บไซต์แบบ mobile responsive ที่สามารถยดหดก็ยังกึ่งกลางได้ครับ

<div class="container">
    <div id="element"> ... </div>
</div>
.container {
    height: 300px;
    text-align: center;  /* align the inline(-block) elements horizontally */
    font: 0/0 a;         /* remove the gap between inline(-block) elements */
}

.container:before {    /* create a full-height inline block pseudo=element */
    content: ' ';
    display: inline-block;
    vertical-align: middle;  /* vertical alignment of the inline element */
    height: 100%;
}

#element {
    display: inline-block;
    vertical-align: middle;  /* vertical alignment of the inline element */
    font: 16px/1 Arial sans-serif;        /* <-- reset the font property */
}
ความหมายของโค๊ดด้านบนตามภาพเลยครับง่ายๆ

แค่นี้ละครับ ไปละครับ
เครดิตเว็บ stackoverflow