ฉันจะลบ Bootstrap ออกจากส่วนหน้าของ Joomla ได้อย่างไร

เมื่อเร็ว ๆ นี้ฉันพยายามลบ Bootstrap ทั้งหมดออกจากส่วนหน้าของ Joomla เพื่อการดีบัก ฉันใช้เทมเพลตโครงกระดูกพร้อมการติดตั้ง Joomla 3.3 ใหม่ ฉันลบ Bootstrap ทั้งหมดออกจากเทมเพลตและปิดปลั๊กอินและโมดูลทั้งหมดที่ฉันคิดว่าสามารถโหลดได้ ฉันยังล้างแคชของ Joomla ด้วย แม้จะเป็นเช่นนั้น firebug บอกว่า Joomla ยังพยายามโหลด bootstrap.min.js จาก /media/jui/js/bootstrap.min.js

ฉันได้รับปัญหาโดยการเปลี่ยนชื่อไฟล์ bootstrap ชั่วคราว แต่มันทำให้ฉันสงสัย

• สิ่งนี้เกิดขึ้นกับการติดตั้ง Joomla 3.3 ทั้งหมดหรือเป็นเพียงของฉัน
• มีวิธีที่ฉันสามารถระบุตำแหน่งที่ bootstrap ถูกโหลดมาจากไหน?
• มีวิธีที่ฉันสามารถปิดการใช้งาน bootstrap จากการโหลดหรือไม่?

สิ่งนี้เกิดขึ้นกับการติดตั้ง Joomla 3.3 ทั้งหมดหรือเป็นเพียงของฉัน

ในเวอร์ชัน: 3.2-3.7 (ฉันทดสอบ)

มีวิธีที่ฉันสามารถปิดการใช้งาน bootstrap จากการโหลดหรือไม่?

ใช่แล้ว เพียงลบออกก่อนสร้างส่วนหัวโดยใช้ event onBeforeCompileHead ( ข้อมูลเพิ่มเติมในเอกสาร )

ในมุมมองของความเป็นไปได้ของการแนบไลบรารีเมื่อใดก็ได้โดยนามสกุลต่าง ๆ ไม่เพียงพอที่จะลบออกจากเทมเพลตและโมดูลสองสามบรรทัด นี่ไม่ใช่ทางออกที่สมบูรณ์แบบ แต่คุณสามารถมั่นใจได้ว่ามันจะไม่โหลด

ในโครงการของฉันฉันใช้ bootstrap 3.2 ฉันใช้เวลาทั้งวันเพื่อหาวิธีลบ bootstrap 2

ทางออกเดียวคือการลบสคริปต์ก่อนสร้างส่วนหัว

โซลูชันของฉันคือสร้างปลั๊กอิน:

class plgSystemYourPlugin extends JPlugin
{
    public function onBeforeCompileHead()
    {
        // Application Object
        $app = JFactory::getApplication();

        // Front only
        if( $app instanceof JApplicationSite )
        {
            $doc            = JFactory::getDocument();
            // Remove default bootstrap
            unset($doc->_scripts[JURI::root(true).'/media/jui/js/bootstrap.min.js']);
        }
    }
}

มันทำงานได้ใน Joomla! 3.2-3.6

(สำหรับผู้สนใจ) ฉันต้องลบสิ่งนี้ด้วย:

    unset($doc->_scripts[JURI::root(true).'/media/system/js/frontediting.js']);
    unset($doc->_scripts[JURI::root(true).'/media/system/js/html5fallback.js']);

อีกทางเลือกหนึ่งที่ฉันมักจะชอบทิ้งเพราะมันไม่เกี่ยวข้องกับการแก้ไขไฟล์หลักคือการแทนที่ไฟล์ css ด้วยไฟล์ css เปล่าในแม่แบบของคุณ สิ่งนี้จะยังนำไปสู่การเรียกไปยังเซิร์ฟเวอร์ของคุณเพื่อโหลดทรัพยากร แต่คุณไม่จำเป็นต้องใส่สไตล์การบูต

เพียงแค่เพิ่มไฟล์ที่ว่างเปล่าที่นี่: และtemplates/YOUR_TEMPLATE/css/jui/bootstrap.min.csstemplates/YOUR_TEMPLATE/js/jui/bootstrap.min.js

โดยปกติการตั้งค่าส่วนประกอบใด ๆ เพื่อใช้ bootstrap จะดูไม่มีสไตล์และยังมีการเรียกให้โหลดไฟล์ css และ js โดยเบราว์เซอร์ อย่างไรก็ตามไฟล์จะว่างเปล่า (ขนาดการดาวน์โหลดขนาดเล็ก) และไม่มีผลกระทบกับสไตล์

แค่แนวคิด (ไม่ได้ทดสอบ) แต่วิธีการเกี่ยวกับการสร้างปลั๊กอินขนาดเล็กที่ทำให้ Bootstrap ไม่ปลอดภัย?

บางสิ่งเช่นนี้

public function onAfterRender() {
    //get the array containing all the script declarations
     $document = JFactory::getDocument(); 
     $headData = $document->getHeadData();
     $scripts = $headData['scripts'];

     //remove script
     unset($scripts['/media/jui/js/bootstrap.min.js']);
     $headData['scripts'] = $scripts;
     $document->setHeadData($headData);
}

หากคุณไม่ได้มองที่การสร้างปลั๊กอินของคุณเองวิธีแก้ปัญหาง่ายๆก็คือลอง:

เลิกตั้งในเทมเพลต

//JS
unset($doc->_scripts[$this->baseurl.'/media/jui/js/bootstrap.min.js']);
// CSS    
unset($doc->_stylesheets[$this->baseurl.'/media/jui/js/bootstrap.css']);

อย่างไรก็ตาม - ส่วนขยายบางส่วนยังคงแทรก js หรือ css แม้ว่าคุณจะลบออก วิธีที่น่าเชื่อถือที่สุดที่ฉันค้นพบคือ:

JCC - ปลั๊กอินควบคุม JS CSS

http://extensions.joomla.org/extensions/extension/core-enhancements/performance/js-css-control

อย่างไรก็ตาม - บางครั้งคุณจะยังคงมี js อินไลน์อยู่ในเทมเพลตของคุณดังนั้น - บางครั้งคุณจะต้องทำ preg_replace สำหรับ inline js

นี่คือสิ่งที่ทำให้ฉันเริ่มต้นตั้งแต่ Joomla 3.x และจนถึงทุกวันนี้ยังไม่มีการดำเนินการใด ๆ เพื่อให้ผู้ใช้มีตัวเลือกเพื่อป้องกันไม่ให้ไฟล์บูตสแตรปโหลด

น่าเสียดายที่ Bootstrap ได้รับการโหลดจากหลักของ Joomla และนี่เป็นเพราะคุณสมบัติหลักบางอย่างที่จำเป็นต้องใช้ในการทำงานดังนั้นการลบออกอย่างสมบูรณ์จะป้องกันคุณลักษณะบางอย่างจากการทำงานเช่น Tooltip

วิธีเดียวที่จะลบ (ที่ฉันรู้) คือผ่านแฮกหลักในไฟล์ต่อไปนี้: ( ไม่แนะนำ )

ห้องสมุด \ CMS \ HTML \ bootstrap.php

วิธีเดียวที่ฉันคิดคือสร้างเทมเพลตแทนที่สำหรับทุกโมดูลส่วนประกอบและปลั๊กอินที่เรียกไลบรารี bootstrap และลบออก

ทั้งสองวิธีนั้นไม่ดี แต่ Joomla 3.x นั้นถูกสร้างขึ้นบน Bootstrap ดังนั้นเราต้องอยู่กับมัน

มีสองวิธี:

1. ยกเลิกการตั้งค่าไฟล์ที่รวมอยู่ในเทมเพลตของคุณแล้วสร้างการแทนที่เพื่อป้องกันโมดูลหรือส่วนประกอบใด ๆ ที่คุณอาจใช้รวมถึงไฟล์เหล่านั้นอีกครั้ง (ไม่ทำงานเท่าที่ฟัง)

   2. ใช้หนึ่งในปลั๊กอินของระบบจำนวนมากที่สามารถทำได้ โดยส่วนตัวฉันขอแนะนำhttps://github.com/phproberto/plg_sys_mootableอันนี้เพราะมันให้การควบคุมเต็มรูปแบบในการควบคุมเวลาและสถานที่ที่จะลบไฟล์ดังนั้นมันสามารถตั้งค่าให้ไม่ทำการแก้ไขแบบ front-end ตัวอย่าง (ซึ่งถ้าคุณลบ ทุกอย่างจะพังตามปกติ)

ตัวเลือกที่ 2 มีข้อได้เปรียบที่ใช้งานง่าย แต่คุณยังต้องใช้ชีวิตอยู่กับมาร์กอัป Bootstrap 2.x crummy ที่ทำให้ไซต์ของคุณเกลื่อน ตัวเลือกที่ 1 ใช้เวลาทำงานเพิ่มขึ้นเล็กน้อย แต่หมายความว่าคุณสามารถลบBootstrap ได้ทุกครั้ง ตัวเลือกที่ฉันชอบเสมอ ดูhttp://joomlafuture.com/สำหรับรหัสตัวอย่าง

Joomla ไม่โหลด bootstrap CSS โดยอัตโนมัติ แต่โหลด JS หากแม่แบบของคุณใช้วิธีมาตรฐานเพื่อโหลดส่วนหัว Joomla:

<jdoc:include type="head" />

มันจะโหลดไฟล์ mootools, jquery และ bootstrap ตามลำดับนี้:

<script src="/media/system/js/mootools-core.js" type="text/javascript"></script>
<script src="/media/system/js/core.js" type="text/javascript"></script>
<script src="/media/system/js/caption.js" type="text/javascript"></script>
<script src="/media/system/js/mootools-more.js" type="text/javascript"></script>
<script src="/media/jui/js/jquery.min.js" type="text/javascript"></script>
<script src="/media/jui/js/jquery-noconflict.js" type="text/javascript"></script>
<script src="/media/jui/js/bootstrap.min.js" type="text/javascript"></script>

มันไม่ได้โหลดไฟล์ CSS คุณสามารถทดสอบได้โดยลบบรรทัดออกจากไฟล์เทมเพลตของคุณจากนั้นตรวจสอบว่าไฟล์ใหญ่ใดหายไป

bootstrap CSS ถูกโหลดโดยแม่แบบของคุณ Joomla (ตั้งแต่ 2.5 ฉันเชื่อว่า) รวม Bootstrap 2.x ไว้ในไฟล์มีเดียเพื่อให้เข้าถึงได้ง่าย Protostar ด้วยเหตุผลบางอย่างไม่เรียก bootstrap จากไฟล์สื่อ แต่พวกเขาได้คัดลอกและวาง CSS บูตทั้งหมดลงในไฟล์ template.css เฟรมเวิร์กอื่นเรียก Bootstrap ตัวอย่างเช่น Warp 7 จะมีช่องทำเครื่องหมายเพื่อเปิดใช้งานหรือปิดใช้งาน Bootstrap

เนื่องจากส่วนหน้าและส่วนหลังมีเทมเพลตที่แตกต่างกัน Bootstrap จึงสามารถโหลดหรือปิดการใช้งานสำหรับอันใดอันหนึ่งและไม่ใช่แบบอื่น ไม่มีการพึ่งพาหากคุณต้องการปิดการใช้งาน Bootstrap จากส่วนหน้าและไม่ใช่ส่วนหลัง

การตั้งค่าของฉันคือ Bootstrap 3 ดังนั้นในเทมเพลตที่กำหนดเองหลายแบบฉันได้ดาวน์โหลดและรวม bootstrap 3 css ไว้ในหัวเทมเพลตของฉันหลังบรรทัด joomla และภายในแท็ก head template ของฉัน:

$document = JFactory::getDocument();
$document->setMetaData( 'viewport', 'width=device-width, initial-scale=1, minimum-scale=1' );
$document->addStyleSheet($this->baseurl.'/templates/'.$this->template.'/css/bootstrap.min.css');

วิธีนี้แตกต่างกันเล็กน้อยสำหรับเฟรมเวิร์กเช่น Warp 7 นอกจากนี้คุณยังสามารถโหลดโดยตรงจาก bootstrap CDN url หากคุณต้องการ

ดังนั้น Joomla จะไม่บังคับให้คุณใช้ Bootstrap หรือ Bootstrap เวอร์ชั่นใด ๆ เป็นอย่างน้อยสำหรับ CSS คุณสามารถใช้กรอบการตอบสนองอื่น ๆ หากคุณต้องการ มันทำทั้งหมดในเทมเพลต ไม่จำเป็นต้องแฮ็กหรือปลั๊กอิน

Joomla 3.3 (น้อยกว่า) ใช้ Bootstrap 2.3 ไม่ใช่ Bootstrap 3.X

ฉันต้องการย้ายไป Bootstrap รุ่นใหม่และมีตำแหน่งมากมายที่ฉันต้องเปลี่ยนแน่นอนตามความคิดของฉัน ฉันทำไปแล้ว แต่เมื่อไม่นานมานี้

ในหลาย ๆ ตำแหน่งของรหัสฉันต้องปิดการใช้งาน Bootstrap เช่นรหัสด้านล่าง:

// เพิ่มกรอบงาน JavaScript JHtml :: _ ('bootstrap.framework');

และสร้างเทมเพลต Joomla ใหม่สมบูรณ์เพื่อทำเช่นนั้น แต่ถ้าคุณต้องการโยกย้ายไปยังเฟรมเวิร์ก UI อื่นที่ฉันคิดว่าคุณต้องดำเนินการตามขั้นตอนเหล่านี้ด้วยและอย่างน้อยคุณก็มีส่วนประกอบโมดูลโมดูลปลั๊กอินและรหัสมรดก Joomla บางส่วนที่คุณต้องพัฒนาอีกกว่า 30 รายการ มันง่าย แต่ต้องการเวลามาก

การรับรู้ใหม่ 02 กรกฎาคม 2558: ขึ้นอยู่กับวิธี "unset" ใน Joomla ที่เพื่อนของเราบางคนพูดถึงในฟอรัมนี้ฉันสามารถปิดการใช้งาน Bootstrap และ Mootools รุ่นก่อนหน้าหรือไลบรารี Javascript หรือไฟล์ CSS อื่น ๆ ฉันขอโทษก่อนที่ฉันจะพูดถึงวิธีการแก้ปัญหาที่ไม่ดี คุณสามารถอ่านโพสต์นี้เพื่อรับข้อมูลเพิ่มเติมเพื่อปิดการใช้งาน Bootstrap

หรือคุณสามารถใช้เทมเพลตจาก Yootheme ตั้งเป็นค่าเริ่มต้นจากนั้นในการตั้งค่าเทมเพลตนั้นเลือก "ห้ามโหลด bootstrap"