如何在移動設備上隱藏Joomla模塊,您經常會發現自己想要隱藏手機,iPad設備上的某些模塊。您很可能會考慮這些模塊的重要性較低,并希望避免用戶在到達您認為相關的區域之前必須向下滾動冗長的內容頁面。或者,您可能希望將模塊替換為內容更適合于較小屏幕設備的其他模塊。值得慶幸的是,自從Bootstrap引入Joomla以來,現在這很容易做,因為Bootstrap為此目的提供了一些類。
可以通過Joomla模塊設置中可用的“模塊類后綴”字段將這些類添加到模塊中。無論您在此字段中添加什么內容,都將將該類名添加到模塊的周圍div中,因此將該類的屬性應用于整個模塊。只需導航至模塊管理器(擴展->模塊管理器),然后單擊即可。進入模塊設置后,選擇“高級”標簽。然后,您可以根據希望在每個屏幕尺寸上顯示模塊的方式,將相關的類添加到“模塊類后綴”字段中。
小型設備電話(小于768像素)
hidden-phone
小型設備平板電腦(≥768px)
hidden-tablet
中型設備臺式機(≥992px)
hidden-desktop
請注意,根據您的Joomla模板,您可能需要在該字段的第一個類之前添加一個空格,以使其正常運行。
單擊“保存”,僅此而已。現在,您可以通過刷新頁面并將瀏覽器窗口調整為必要的屏幕尺寸或在相應設備上打開頁面來測試您的網站。





