opentype Posted May 1, 2015 Posted May 1, 2015 AddToHeadIt can be difficult to adhere to strict standards when dealing with templates and piece-meal code. Often you compromise and have javascript and CSS scattered throughout the finished document.IP.Board allows you to add content to the document <head> very quickly and simply:{parse addtohead="/js/someScript.js" type="javascript"}{parse addtohead="/css/someCSS.css" type="css"}{parse addtohead="<script>alert('boo')</script>" type="raw"}The above is from 3.X. How do we do that in 4.0? I want to add CSS code to certain Pages templates only.
Marcher Technologies Posted May 18, 2015 Posted May 18, 2015 \IPS\Output::i()->jsFiles = array_merge(\IPS\Output::i()->jsFiles, \IPS\Output::i()->js('front_group.js', 'rss', 'front')); \IPS\Output::i()->cssFiles = array_merge(\IPS\Output::i()->cssFiles, \IPS\Theme::i()->css('group.css', 'rss', 'front'));It's not gone, though it no longer supports 'raw'. The method being passed as the second parameter of array_merge here returns an array of fully built URL's to the files, so if you wanted to say load something from google's cdn that should work(untested, but is used that way in core).That said, you may find it easier to just use the page assets feature with js/css added in the Pages template manager.(For anyone wondering where the deuce the odd example came from, I pulled it from the index controller of my Feeds application).
opentype Posted May 18, 2015 Author Posted May 18, 2015 Thanks.It that something I could place in a Pages template (inside {{ }})? I just tried it and couldn’t see an effect. I am trying to add these two files on my server to just one Pages listing template instead of sticking them in a global template. <script type="text/javascript" src="/zmodules/justifiedGallery/jquery.justifiedGallery.min.js"></script> <link type="text/css" rel="stylesheet" href="/zmodules/justifiedGallery/justifiedGallery.min.css">
Marcher Technologies Posted May 18, 2015 Posted May 18, 2015 That may depend on the value of your theme's setting for 'Javascript include location'. Due to the fact you are working from a template parsed from within a widget, that theme setting may need to be 'Just before </body> tag' instead of 'Inside the <head>' to work, though that is untested, it may simply be that the template parsing for that template is too late in the execution. I've honestly just ended up using the page assets feature for such instead of trying to limit it to one view.
opentype Posted May 18, 2015 Author Posted May 18, 2015 I've honestly just ended up using the page assets feature for such instead of trying to limit it to one view.Ahh, okay, found that. Yes that will do the trick. Thanks again.
opentype Posted May 20, 2015 Author Posted May 20, 2015 Come to think of it: I have another site where each Pages database record represents a typeface and that typeface should then be loaded and used as webfont when the record is opened. So I would indeed need a way to add the @font-face declaration to the head from within the specific view of the database. If anyone has any idea or working code, I would be interested in that.
opentype Posted July 11, 2015 Author Posted July 11, 2015 After a lot of trial and error I managed to activate record-specific header elements in Pages based on Marcher’s lead.In the theme templates I added a new css file under CMS --> Front --> Custom.In the Pages record view template I then added:{{\IPS\Output::i()->cssFiles = array_merge(\IPS\Output::i()->cssFiles, \IPS\Theme::i()->css('custom/something.css', 'cms', 'front'));}}Now I can add CSS for just this database view or even for specific data from the individual record. Yeah!
sobrenome Posted July 11, 2015 Posted July 11, 2015 Good! And how to add head meta info, like og:image for facebook sharing if we do not want to use the built in record image?
Recommended Posts
Archived
This topic is now archived and is closed to further replies.