2

I have a javascript that I need to add to a static block. Could anyone explain it step by step?

1

Login to admin panel Click on CMS > Static Blocks.

Create New Block suppose Identifier = block_test

Add Content :

Click <a href="javascript:void(0)" onclick="checkFunction()">here</a> to check Javascript
<script type="text/javascript">// <![CDATA[
    function checkFunction(){
        alert('test Completed');
    }
// ]]></script>

For testing Create CMS page and call CMS block from CMS page

suppose URL Key = test

Add Content :

{{block type="cms/block" block_id="block_test"}}

Go to front end /test and click on "here" link, alert message will popup.

1

Login to the admin and navigate to content > blocks, find the block you want to edit and click on select > edit.

Click on the hide/show editor button to hide the editor (make sure there are no icons above the text box).

Paste in your Javascript and save the static block. If you see a message about cache then click on it and clear the cache.

Internal JS:

<script>JS Goes Here</script>

External JS:

<script src="path-here.js"></script>

Call a template that contains your JS:

{{block type="core/template" block_id="example.id" template="your/template/path.phtml"}} 
  • Thank you for your ans. But am really a newbie and i do not know anything about codes. This is the code I need to add in a static block. Now can you tell me where to include this code? <script type='text/javascript' src='widgets.ziftsolutions.com/dell.ziftsolutions.com/js/…' charset='utf-8'></script> – sauravluk9 May 25 '17 at 9:40
  • I have updated my answer with more instructions, you need to find the static block in the admin, paste your code in, then save it and maybe need to clear the cache. – Ben Crook May 25 '17 at 10:25
0

1) Create a phtml file in : app/design/frontend/{yourPackage}/{yourTheme}/template/cms/customcms.phtml then put your code in this file.(the code that you want to display in a static block, not the external Js URL)

2) Go to admin cms>static block>your static block>content>hide editor>past this code:

{{block type="core/template name="custom.cms" template="cms/customcms.phtml"}}

3) add this code in app/design/frontend/{yourPackage}/{yourTheme}/layout/local.xml

<layout version="0.1.0">
   <default translate="label" module="page">
       ...
       <reference name="head">
          <action method="addLinkRel"><rel>text/javascript</rel><href> https://YOUR URL TO THE EXTERNAL JS ... .js</href></action>
       </reference>
   </default>
</layout>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.