I created a mini CMS to store code snippets.
It pulls articles form a mongodb database.
I use highlgiht.js to display the code and allow users to copy the snippets.
With HTML, everything works as expected:
{{#article}}
<h1>Demo</h1>
{{{markup}}} <!-- prints raw HTML in the screen, yay! -->
<h1>HTML</h1>
<pre class="pre-scrollable"><code class="html">{{markup}}</code></pre>
<!-- prints escaped HTML in the screen, and highlight.js highlights it perfectly! YAY -->
{{/article}}
Now, with Javascript:
{{#article}}
<h1>Demo</h1>
{{{js}}} <!-- prints empty script tag: <script></script> -->
<h1>JS</h1>
<pre class="pre-scrollable"><code class="html">{{js}}</code></pre>
<!-- prints <script></script> -->
{{/article}}
The content of the field "js" in the database is "console.log("test");"
Why is it not outputting what's saved in the db, but instead it is making up a new script tag on its own??
Thank you!
After pulling most of my hair, I figured it out:
I had a name collision where my document property/field was named "js" and that conflicted with the name of a helper from a library I am using:
https://github.com/helpers/handlebars-helpers/blob/master/lib/html.js#L85
Related
I have tried the following in my blade template:
#section('styles')
<link href="{{asset('assets/css/app.css')}}" />
#stop
In the master blade template I have included the following:
<link href=asset('/assets/template/css//invoiceTemplate.css')rel="stylesheet" type="text/css"/>
I you want to include a CSS / JS file for a specific blade use stacks (see here)
from the documentation:
#push('scripts')
<script src="/example.js"></script>
#endpush
You may push to a stack as many times as needed. To render the complete stack contents, pass the name of the stack to the #stack directive:
<head>
<!-- Head Contents -->
#stack('scripts')
</head>
you can also place them at the bottom of your blade (where a lot of people call thier JS files these days)
You need to add #yield('styles') to your master blade template.
Yes it is. Write this code to your master template
#yield('page-styles')
and add this also to the specific blade file where you want to add a specific CSS file.
#section('page-styles')
//Your specific css file
#stop
Make sure that the parameter inside the #section and #yield are the same.
In this case, I've used 'page-styles'.
I'm trying to create an XML file that shows different news articles within an iframe. A shortened version of the news' body is shown as a subtitle (which is already prewritten and chosen with the help of PHP, this isn't the issue) and to show the full body, the idea is to take the user to a link where the full body is shown. The PHP creates a file in the folder 'articles' on the root directory which contains the full body with the folder name as the title (e.g if the title was 'foo' then the xml file would be under: /articles/foo/index.xml (the XSL is already done for that file)).
My idea is to add a link to the XML with the shortened body to the XML page that would link to the file in the articles folder to allow a user to read the whole body. How would I, using the XSL stylesheet, create a link to this XML page with the whole body?
Below is the code for the XML and XSL to be used in the iframe (without the body)
XML code:
...
<articles>
<article>
<title>(This is what I want to be used as a link)</title>
<image></image>
<subtitle></subtitle>
</article>
</articles>
XSL code:
...
<table...>
<xsl:for-each select="articles/article">
<th...><img src="{image}"...></th>
<th...><h1><xsl:value-of select="title" /></h1></th>
</xsl:for-each>
</tr>
<tr>
<xsl:for-each select="articles/article">
<th...><h2><xsl:value-of select="subtitle" /></h2></th>
</xsl:for-each>
</tr>
</table>
...
I'm looking to set the XSL title part to a href to link to the mentioned page. How would I do this?
I figured this out by, in the XSL, doing the following:
...
<th...><h1><xsl:value-of select="title" /></h1></th>
...
I want to use a script on my web site and I know that I must put all scripts separated from the template in a .js file. But I don't know how to do it this time when the script is executed directly in the script src:
<script type="text/javascript" src="http://svenskfotboll.se/widget.aspx?scr=table&ftid=39662&b1=%23006bb7&f1=%23ffffff&b2=%23bfd4f3&f2=%23000000&b3=%23ffffff&f3=%23000000&b4=%23ececec&bo=%23ffffff&s=1"></script>
What is the best practice to get it to work in Meteor?
I'd go to that url, get that script, and save it in a file in your project. However, there wasn't anything actually at that url when I just checked it out. That would definitely be a problem too :)
EDIT: You can also stick in the head tag.
EDIT 2: if you want it to display in a template, like if it's a widget such as yours, you can insert it manually every time the template re-renders. It's pretty simple, actually. First we've got the template code:
Template.myWidget.rendered = function () {
$('#my-widget').html('<script src="src-here.js"></script');
}
And then the actual template:
<template name="myWidget">
<div id="my-widget">Loading...</div>
</template>
Finally, wherever you want the widget to appear in your html, just insert {{>myWidget}}
Use jQuery.getScript(): http://api.jquery.com/jquery.getscript/
In your case:
$.getScript( "http://svenskfotboll.se/widget.aspx?scr=table&ftid=39662&b1=%23006bb7&f1=%23ffffff&b2=%23bfd4f3&f2=%23000000&b3=%23ffffff&f3=%23000000&b4=%23ececec&bo=%23ffffff&s=1" );
You can also specify callback for success or failure (please see documentation linked above).
Suppose I have 3 html files , A.html , B.html and C.html
I want the HTML code from C.html to act as the footer of A.html and B.html .
Currently what I do is write the total contents of C.html in A & B to have my footer.
Is it possible to use just a single code or css-stlye to load the contents of C.html
Suppose C.html looks like --
<a href=k.com>K</a><br>
<a href=b.com>b</a><br>
<a href=d.com>d</a><br>
<b>This page made by me</b>
How to have this code inserted to other files just by using a single code.
Please note that I have seen this Include another HTML file in a HTML file page but the codes seem to not work for me. I can use <iframe> but then it doesn't look pretty.
If your server supports any server side language (as most web servers does)
then you can easily marge files.
// Example in php.
<?php
include "a.html";
include "b.html";
include "c.html";
?>
In pure HTML it is not possible. Why not use an iFrame? You can then style it as you choose.
Or you can use jQuery's load method to pull content into your page.
Or use a language like PHP to include html parts
I am working on Dreamweaver TBB in SDL Tridion 2011 SP1. In the TBB I am using the data from different component presentations.
My Template Building Block looks like this.
Main Component:
<div>##Component.Schema.Title##</div>
<!-- TemplateBeginRepeat name="Fields.link" -->
##RenderComponentPresentation(Field, "tcm:1-8142-32")##
<!-- TemplateEndRepeat -->
Component Template: tcm:1-8142-32
Its DWT TBB looks like this.
<!-- TemplateBeginIf cond="Component.Fields.text" -->
<div>##RenderComponentField("text",0)##</div>
<!-- TemplateEndIf -->
When I previewed the Component I got the output and all component presentations executed as expected.
Output:
SchemaName
data1
data2
Then I created the Page with the page TBB.
<html>
<head></head>
<body>
<!-- TemplateBeginRepeat name="Components" -->
##RenderComponentPresentation()##
<!-- TemplateEndRepeat -->
</body>
</html>
The output is not as expected. The Component Template "tcm:1-8142-32" is not executed.
output:
SchemaName
I want to make SiteEdit to linked component also.
Do I need to add extra templates to the existing ones? I am using Tridion 2012 UI.
I came to know that we need add isQueryBased, property must be set to true.
If yes, can any one help the command to set it true?
I don't know where the problem lies.
Can any one help me out to modify the code and implement SiteEdit for the embedded Component?
In a Dreamweaver template RenderComponenetPresentation() can be called in two ways.
If you are iterating through the Component Presentations on a page ( which I think is what you are doing?)
If for some reason you need to Render a component with a different template, not the one you've added it to the page with.
Assuming number one is what you are doing, then you have added the Component to the page with the correct Template. Therefore you can call ##RenderComponentPresentation()## with no arguments like this:
<html>
<head></head>
<body>
<!-- TemplateBeginRepeat name="Components" -->
##RenderComponentPresentation()##
<!-- TemplateEndRepeat -->
</body>
</html>
"IsQueryBased" is unrelated to your problem. This is connected to SiteEdit and Dynamic Component Presentations.
Update -
It looks like you have 2 questions here:
How can I call RenderComponentPresentation for linked components
How can i make the Component be "SiteEditable"
Looking at question 1 - Assuming you the array of components are not component presentations on the page your initial method was almost correct:
##RenderComponentPresentation(Component.ID,"tcm:xx-xx-xx")##
You should be able to get the component ID from the array, but you will need to specify the ComponentTemplate ID yourself.
For testing purposes, first of all hard code the Tcm ID of the Component Template.
Since putting Tcm ids in templates is bad practice, you will then need to write a TBB to make this available in the package for you. You can then replace the Tcm Id you used for testing.
In relation to your SiteEdit question, this guide might help, if not post a new question detailing the exact nature of your issue.