• มาทำความสะอาดโค้ด TYPO3 กันเถอะ

    ในระหว่างที่กำลังนั่งพัฒนาแพ็คเกจตัวใหม่ เพื่อให้ใช้งานได้ง่ายขึ้น และรองรับกับ Features ใหม่ ๆ ที่กำลังจะมาถึง ก็เลยคิดว่า หนึ่งในนั้นก็น่าจะเป็นเรื่องของการ clean up code ให้สะอาด เวลาโหลดหน้าเว็บไซต์แล้ว จะได้ไม่รอนานจนน่าเบื่อ เพราะเว็บไซต์มัวแต่โหลดสิ่งที่ไม่จำเป็นสำหรับการแสดงผลนั่นเอง TYPO3 มี TypoScript สำหรับการเปิดใช้งานฟังก์ชั่นการทำงานต่าง  ๆ ที่อำนวยความสะดวกให้กับเราเป็นอย่างมาก แต่ก็ต้องการความเข้าใจอยู่ไม่ใช่น้อยเหมือนกัน เอาเป็นว่า เข้าเรื่องสั้น ๆ และก็ง่าย ๆ กันเลยดีกว่า ปกติ TypoScript สำหรับการ Clean Up จะกำหนดที่ Setup # ปิดการทำงานของ prolog config.xmlprologue = none # ปรับแต่ง RTE ให้ทำงานได้ดีขึ้น lib.parseFunc_RTE.nonTypoTagStdWrap.encapsLines.addAttributes.P.class > lib.parseFunc_RTE.nonTypoTagStdWrap.encapsLines.remapTag > lib.parseFunc_RTE.nonTypoTagStdWrap.encapsLines.addAttributes.DIV.class > # ลบแท็กที่ไม่จำเป็นสำหรับภาพ styles.content.imgtext.caption.1.wrap […]

    Read more »
  • การ Render Text ให้เป็น Image ด้วย GIFBUILDER

    ฟังก์ชั่นการทำงานของ TYPO3 ถ้าลองศึกษาลงลึกแล้วจะพบว่ามากมายเลยทีเดียว โดยเฉพาะอย่างยิ่ง  typoscript ที่สามารถปรับให้ใช้งานได้ตามความต้องการได้หลากหลาย อย่างเช่น การ Render Text ให้เป็น Image ด้วย GIFBUILDER ก่อนอื่นก็จะต้องติดตั้ง ImageMagick (Linux) หรือ GraphicMagic (Windows) เพื่อให้การทำงานครบถ้วนสมบูรณ์ วันนี้นำตัวอย่างการ Render ให้กับ Main Menu ใน IBSTV Package ซึ่งจะต้องปรับแต่ง typoscript ดังนี้ lib.mainmenu.wrap = | lib.mainmenu.10 = HMENU lib.mainmenu.10 { wrap = <div class=”hlist”><ul id=”nav”>|</ul></div> maxItems = 10 entryLevel = 0 excludeUidList = 0 1 = […]

    Read more »
  • เพิ่มลูกเล่น Accordion ให้กับ tt_news ด้วย JQuery ใน TYPO3 แบบง่าย ๆ

    หลาย ๆ คนคงกำลังมองหา feature ที่สามารถปรับแต่งให้เกิดความน่าสนใจกับเว็บไซต์ ด้วยการนำสิ่งที่มีอยู่ในระบบเช่น ระบบข่าวสาร มาใส่ลูกเล่นเพื่อให้เกิดการตอบโต้กับผู้ใช้งาน เช่น การคลิ๊กแล้วเปิดเนื้อหาข่าว แทนที่จะลิ้งก์ไปที่หน้าใหม่ เพื่อดูรายละเอียดของข่าวนั้น ๆ แล้วต้องเตรียมอะไรบ้างหล่ะ? 1. tt_news HTML Template ที่มีการ Customize ใส่ Class และตำแหน่งที่ต้องการเช่น <div class=”news-list-container”> <!– ###CONTENT### begin –> <!– ###NEWS### begin –> <div class=”news-list-item-accordion”> <h2 class=”acc_trigger”>###NEWS_TITLE###</h2> <div class=”acc_container”> <div class=”block”> ###NEWS_CONTENT### </div> </div> </div> <!– ###NEWS### end–> <!– ###CONTENT### end –> </div> 2. CSS […]

    Read more »
  • การกำหนดชนิดของ HTML ใน TYPO3 (TYPO3 DocType)

    การกำหนดชนิดของ HTML ใน TYPO3 สามารถทำได้หลากหลายและแตกต่างกันออกไปในแต่ละหน้า ด้วยการใช้ TYPO3 template setup อาทิ config.doctype = html5 config.xhtmlDoctype = html5 config.xmlprologue = none config.xhtml_cleaning = all เมื่อคุณดูโค้ดที่หน้าเว็บไซต์ จะเห็นการแสดงผลดังนี้ <!DOCTYPE html> ชนิดของ HTML ที่สามารถกำหนดได้มีดังนี้ html5 (HTML5 doctype) xhtml_trans (XHTML 1.0 Transitional doctype) xhtml_frames(XHTML 1.0 Frameset doctype) xhtml_strict (XHTML 1.0 Strict doctype) xhtml_basic (XHTML basic doctype) xhtml_11 (XHTML 1.1 doctype) xhtml_2 […]

    Read more »
  • สร้าง sub menu ด้วย TypoScript

    มือใหม่ที่กำลังสร้าง TYPO3 Template และ ต้องการสร้าง sub menu สำหรับอำนวยความสะดวกในการเข้าถึงหน้าเว็บย่อย ๆ ในเว็บไซต์ของเราอย่างเป็นระเบียบ ไอบีเอสกรุงเทพ มีตัวอย่างดี ๆ สำหรับการสร้าง submenu ด้วย TypoScript มาฝากกันค่ะ temp.submenu.20 = HMENU temp.submenu.20 { wrap = | entryLevel =0 1 = TMENU 1 { expAll = 0 noBlur = 1 wrap = | NO = 1 NO.ATagTitle.field = subtitle NO.allWrap = | NO.wrapItemAndSub = | NO.stdWrap.htmlSpecialChars = […]

    Read more »

Back to Top