# comrade-webflow > Webflow support library Latest version **1.1.6** (published 2021-10-19) · ISC license · 0 weekly downloads ## Install ```sh npm install comrade-webflow pnpm add comrade-webflow yarn add comrade-webflow bun add comrade-webflow ``` ## Health **Score 20/100 (F)** — status: abandoned. Positive: esm support; no vulnerabilities. Warnings: low downloads; no types. Negative: abandoned; low maintenance score. ## Facts | | | |---|---| | Version | 1.1.6 | | Published | 2021-10-19 | | First published | 2021-02-07 | | Weekly downloads | 0 | | License | ISC | | TypeScript types | none | | Module format | ESM + CommonJS | | Dependencies | 0 | | Unpacked size | 25.8 KB | | Known vulnerabilities | 0 | | Install scripts | no | | Author | Vadim Denisenko, http://github.com/ihapitw | | Maintainers | ihapitw | ## Links - npm: https://www.npmjs.com/package/comrade-webflow - Repository: https://github.com/ihapitw/comrade-webflow - Homepage: https://github.com/ihapitw/comrade-webflow#readme - Issues: https://github.com/ihapitw/comrade-webflow/issues - npm.io page: https://npm.io/package/comrade-webflow ## Recent versions - 1.1.6 (latest) — 2021-10-19 - 1.1.5 — 2021-08-20 - 1.1.4 — 2021-08-20 - 1.1.3 — 2021-08-20 - 1.1.2 — 2021-07-14 - 1.1.1 — 2021-06-20 - 1.1.0 — 2021-02-10 - 1.0.3 — 2021-02-07 - 1.0.2 — 2021-02-07 - 1.0.1 — 2021-02-07 - 1.0.0 — 2021-02-07 ## README # Comrade Webflow ### CDN: --- ```HTML ``` > Important: use in `` crossite if you want to use libraries inside symbols ## Styles --- `style` will be loaded if have `trigger` element on page ```JS CWF.register({ // multiple selectors: '.hero, .hero-inner' trigger: '.swiper-container', type: 'style', alias: 'swiper', url: 'https://unpkg.com/swiper/swiper-bundle.min.js' }) ``` > not fill `trigger` if you want to always load style ## JS Libraries --- ```js CWF.register({ type: 'script', alias: 'swiper', url: 'https://unpkg.com/swiper/swiper-bundle.min.js' }) ``` `script` will loaded on request and run callback function ```js CWF.use('swiper', function () { new Swiper('.foo', { //... }) }) ``` > if the library is already loaded immediately execute a callback ### jQuery ready callback --- ```js CWF.$ready(function () { // some code with jquery $('body').html(' ) ') }) ``` > code will be executed only after jquery is loaded, can be used inside the symbol in the `embed code` # Dispatcher ```js function changeMenuStateCallback(state) { document.getElementById('menu').dataset.state = state } // add event listener CWF.on('change-menu-state', changeMenuStateCallback) // fire event with data CWF.emit('change-menu-state', 'open') CWF.emit('change-menu-state', 'closed') // remove event listener CWF.off('change-menu-state', changeMenuStateCallback) ``` # Schema ## General #### HTML ```js CWF.rootSchema( { '@type': 'Restaurant', '@id': 'http://davessteakhouse.example.com', name: "Dave's Steak House", address: { '@type': 'PostalAddress', streetAddress: '148 W 51st St', addressLocality: 'New York', addressRegion: 'NY', postalCode: '10019', addressCountry: 'US' } }, { reviews: { itemSelector: '.review-item', authorSelector: '.review-author', bodySelector: '.review-body', ratingSelector: '.review-rating' } } ) ``` ```html

Michael Smith

Lorem ipsum dolor sit amet consectetur adipisicing elit.

Joe Smith

Lorem ipsum dolor sit amet consectetur adipisicing elit.

4.5

``` > if reviews are not found on the page, then they will not go to schema #### Result in `` ```html ``` ## Breadcrumbs #### HTML ```html

``` #### JS ```js CWF.specialSchema({ type: 'breadcrumbs', rootSelector: '.breadcrumb-item' }) ``` #### Result in `` ```html ``` ## FAQ #### HTML ```html

Question 1

Answer 1

Question 2

Answer 2

``` #### JS ```js CWF.specialSchema({ type: 'faq', rootSelector: '.faq-item', questionSelector: '.faq-question', answerSelector: '.faq-answer' }) ``` #### Result in `` ```html ``` --- _Source: https://npm.io/package/comrade-webflow · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._