PHPackages silverbackis/common-js-bundle - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. [Templating & Views](/categories/templating) 4. / 5. silverbackis/common-js-bundle ActiveSymfony-bundle[Templating & Views](/categories/templating) silverbackis/common-js-bundle ============================= Symfony bundle to quickly and easily add commonly used Javascript into your Twig templates. 1.0-beta2(8y ago)015MITPHPPHP ^7.0.8 || ^7.1 Since Nov 27Pushed 8y agoCompare [ Source](https://github.com/silverbackis/common-js-bundle)[ Packagist](https://packagist.org/packages/silverbackis/common-js-bundle)[ RSS](/packages/silverbackis-common-js-bundle/feed)WikiDiscussions master Synced 4d ago READMEChangelogDependencies (12)Versions (5)Used By (0) Common JS Bundle ================ [](#common-js-bundle) ***Not affiliated with The CommonJS group*** [![Build Status](https://camo.githubusercontent.com/78f5a3ba9a4ea590b0b2a92a52f26eed75cddc3703eef8ff926428a04b356e1c/68747470733a2f2f7472617669732d63692e6f72672f73696c7665726261636b69732f636f6d6d6f6e2d6a732d62756e646c652e7376673f6272616e63683d6d6173746572)](https://travis-ci.org/silverbackis/common-js-bundle)[![codecov](https://camo.githubusercontent.com/c9f41efb52dd2ebeeb9c8d3c9a9cf11bd35fd79ad714550c3042fe969141b40d/68747470733a2f2f636f6465636f762e696f2f67682f73696c7665726261636b69732f636f6d6d6f6e2d6a732d62756e646c652f6272616e63682f6d61737465722f67726170682f62616467652e737667)](https://codecov.io/gh/silverbackis/common-js-bundle)[![license](https://camo.githubusercontent.com/d011abaf4ccaec9ee1a2e91c45479e72dc5c8462275e2e2392dd5a2811995709/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f6c6963656e73652f73696c7665726261636b69732f636f6d6d6f6e2d6a732d62756e646c652e737667)](LICENCE) This bundle provides twig functions to easily add commonly used Javascript tags & SDKs to any page. By default this bundle will support - Google Analytics - Google Tag Manager (GTM) - Facebook Javascript SDK - Twitter for Websites Requirements ------------ [](#requirements) This bundle is only configured and tested to be used for Symfony >=3.4 All default configurations and examples assume you are using Symfony Flex. Installation ------------ [](#installation) This bundle will be submitted to the Symfony Flex contrib repository shortly with some example configs. If you're using flex, the bundle will automatically be added into yor bundles.php file though. Enable the Symfony Flex Recipes Contrib Repository ``` composer config extra.symfony.allow-contrib true ``` Until merged set the SYMFONY\_ENDPOINT env var: ``` export SYMFONY_ENDPOINT=https://symfony.sh/r/github.com/symfony/recipes-contrib/159 ``` Install the bundle: ``` composer req "silverbackis/common-js-bundle:^1.0@beta" ``` Until merged, unset the environment variable: ``` unset SYMFONY_ENDPOINT ``` Getting Started --------------- [](#getting-started) ### Configuration [](#configuration) The default configuration values will work for 90% of use cases if you simply set the environment variables (when required). Other scripts will be enabled by default. However, you may wish to create a config file to add in default blocks: ``` # config/packages/silverback_common_js.yaml # Enable and configure the scripts you'd like silverback_common_js: google_analytics: default_blocks: page_view: ~ "ec/init": currency: USD ``` `default_blocks` can be an array of blocks you want. You can also include parameters if you want. It will pre-populate blocks in the order provided so you can just write `{{ cjs_js('name') }}` in your twig template > You cannot pass the `default_blocks` variable in via the twig template, but you can still remove and modify the default blocks from the template using `cjs_add_block()` and `cjs_remove_block()` functions Identifiers will be added as environment variables by Flex into your **.env** file. ``` GOOGLE_ANALYTICS_ID= GTM_CONTAINER_ID= FACEBOOK_APP_ID= ``` Set the IDs for these services if you want to enable them. Otherwise they will be disabled. ### Example usage [](#example-usage) Javascript blocks can be configured directly from your twig templates using the following functions ``` {{ cjs_add_block(name, block_name, at_block_name, before_at_block_name, override_params_object) }} ``` > `at_block_name` can be `"false"` (note this is a string) which will result in the function returning the javascript for you to insert. You may which to track a click event for example when a user clicks a link instead of in the main tracking code. You can duplicate an SDK block including any blocks that have already been configured ``` {{ cjs_duplicate(name, block_name, override_params_object) }} ``` You can also remove a block (e.g. if you've duplicated a block but want to remove a specific section ) ``` {{ cjs_remove_block(name, block_name) }} ``` To generate a new model to be inserted as a parameter you can use `cjs_model` - this example shows how you can create your model with arguments to define variables and/or using setters and then how you would inject the model as a parameter into a block. ``` {% set my_model = cjs_model(name, model, args_array) %} {{ my_model.setArg3('arg3') }} {{ cjs_add_block(name, block_name, null, false, { param_name: my_model }) }} ``` Finally to output the scripts **after** all the blocks have been configured for a given block use the `cjs_js` function ``` {{ cjs_js(name, override_params_object) }} ``` If there is an noscript fallback specified, you will want to output this at a different section in your template. This is implemented when using GTM for example. Yuu can output the fallback HTML using `cjs_html` ``` {{ cjs_noscript(name, override_params_object) }} ``` ### Models [](#models) There are models available for some SDK blocks (e.g. Google Analytics Event). You can use these to easily construct and pass data to a block. All models allow you to define all the variables in the constructor (in the order they are documented here) and also have getters and setters. Examples are provided in the individual script docs. ### Supported Javascripts Docs [](#supported-javascripts-docs) #### [Google Analytics](Docs/GoogleAnalytics.md) [](#google-analytics) #### [Google Tag Manager (GTM)](Docs/GoogleTagManager.md) [](#google-tag-manager-gtm) #### [Twitter](Docs/Twitter.md) [](#twitter) #### [Facebook SDK](Docs/FacebookSdk.md) [](#facebook-sdk) ### Contributing a new Javascript [](#contributing-a-new-javascript) Adding an SDK is pretty straight forwards. - A new Provider is required in `CommonJsBundle\Provider\Sdk` extending `CommonJsBundle\Provider\BaseProvider`. - In the dependency injection new configuration parameters will be required - Models can be added in the `CommonJsBundle\Model\PascalCaseName` namespace where PascalCaseName is the name of the new javascript in PascalCase. - Template blocks are added in `Resources/views/blocks/snake_case_name` with an `init.html.twig` file and then a sub directory `js` for all blocks needed. ### Health Score 22 — LowBetter than 22% of packages Maintenance20 Infrequent updates — may be unmaintained Popularity6 Limited adoption so far Community6 Small or concentrated contributor base Maturity47 Maturing project, gaining track record Bus Factor1 Top contributor holds 100% of commits — single point of failure How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Release Activity Cadence Every ~1 days Total 4 Last Release 3088d ago ### Community Maintainers ![](https://www.gravatar.com/avatar/8c65ff41926876a4c14d7478fc36b5b306212d9c735014e5f461a3060651d202?d=identicon)[silverbackis](/maintainers/silverbackis) --- Top Contributors [![silverbackdan](https://avatars.githubusercontent.com/u/25174262?v=4)](https://github.com/silverbackdan "silverbackdan (63 commits)") --- Tags google-analyticsjs-sdksymfony-bundletwig ### Embed Badge ![Health badge](/badges/silverbackis-common-js-bundle/health.svg) ``` [![Health](https://phpackages.com/badges/silverbackis-common-js-bundle/health.svg)](https://phpackages.com/packages/silverbackis-common-js-bundle) ``` ### Alternatives [sylius/sylius E-Commerce platform for PHP, based on Symfony framework. 8.4k5.6M651](/packages/sylius-sylius)[shopware/platform The Shopware e-commerce core 3.3k1.5M3](/packages/shopware-platform)[sulu/sulu Core framework that implements the functionality of the Sulu content management system 1.3k1.3M152](/packages/sulu-sulu)[prestashop/prestashop PrestaShop is an Open Source e-commerce platform, committed to providing the best shopping cart experience for both merchants and customers. 9.0k15.4k](/packages/prestashop-prestashop)[shopware/core Shopware platform is the core for all Shopware ecommerce products. 595.2M386](/packages/shopware-core)[ec-cube/ec-cube EC-CUBE EC open platform. 78527.0k1](/packages/ec-cube-ec-cube) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)