{"version":3,"sources":["webpack:///./src/img/help/how-do-the-funnels-work/funnels6.png","webpack:///./src/img/help/how-do-the-funnels-work/funnels3.png","webpack:///./src/components/help/helpImage/styled.js","webpack:///./src/components/help/helpImage/index.js","webpack:///./src/img/help/how-do-the-funnels-work/edit.png","webpack:///./src/components/ui/image-modal.js","webpack:///./src/img/help/how-do-the-funnels-work/metrics.png","webpack:///./src/img/help/how-do-the-funnels-work/filters.png","webpack:///./src/img/help/how-do-the-funnels-work/funnels4.png","webpack:///./src/img/help/how-do-the-funnels-work/funnels5.png","webpack:///./src/img/help/how-do-the-funnels-work/steps.png","webpack:///./src/img/help/how-do-the-funnels-work/funnels2.png","webpack:///./src/pages/help/how-do-the-funnels-work.js","webpack:///./src/img/help/how-do-the-funnels-work/funnels1.png"],"names":["module","exports","Card","styled","div","props","setMarginBottom","media","desktop","CardBody","HelpImage","cardStyle","className","style","defaultProps","Container","Box","Close","span","ImageWrapped","img","Image","ImageModal","escFunction","event","showModal","state","keyCode","closeModal","setState","openModal","window","innerWidth","componentDidMount","document","addEventListener","this","componentWillUnmount","removeEventListener","render","src","imgStyle","imgModalStyle","alt","title","lazy","modal","onClick","loading","React","Component","related","link","description","Wrapped","HelpArticle","href","img1","img2","img3","img4","img5","img6","img7","img8","img10","img9","signUp","sourceID","target","rel","frontmatter","metaTitle","metaDescription","canonical","section"],"mappings":"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","file":"component---src-pages-help-how-do-the-funnels-work-js-6f181f59b6c8296df729.js","sourcesContent":["module.exports = __webpack_public_path__ + \"static/funnels6-d6799887364a97c623bc378ccefad4ae.png\";","module.exports = __webpack_public_path__ + \"static/funnels3-a9c5fc0e4be2546333cacff5dd6f3470.png\";","import styled from 'styled-components';\nimport { media } from 'theme/breakpoints';\n\nexport const Card = styled.div`\n margin: ${(props) => (props.setMarginBottom ? '2rem 0' : '2rem 0 3rem')};\n border: none;\n\n ${media.desktop} {\n margin: ${(props) => (props.setMarginBottom ? '1.25rem 0' : '1.25rem 0 2rem')};\n }\n`;\n\nexport const CardBody = styled.div`\n box-shadow: 0px 0px 10px #00000029;\n padding: 0;\n`;\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport ImageModal from 'components/ui/image-modal';\nimport * as Styled from './styled';\n\nconst HelpImage = (props) => {\n const { cardStyle, setMarginBottom } = props;\n return (\n \n \n \n \n \n );\n};\n\nexport default HelpImage;\n\nHelpImage.propTypes = {\n cardStyle: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),\n setMarginBottom: PropTypes.bool,\n};\n\nHelpImage.defaultProps = {\n cardStyle: null,\n setMarginBottom: false,\n};\n","module.exports = __webpack_public_path__ + \"static/edit-c577e5f8d0740eb6ca8b2df0aa11c1cf.png\";","import React from 'react';\nimport PropTypes from 'prop-types';\nimport styled from 'styled-components';\n\nconst Container = styled.div`\n top: 0;\n left: 0;\n position: fixed;\n width: 100%;\n height: 100vh;\n background-color: rgba(0, 0, 0, 0.4);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 99999;\n`;\n\nconst Box = styled.div`\n background-color: transparent;\n position: relative;\n width: 95vw;\n height: 95vh;\n padding: 1.5rem;\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 1;\n`;\n\nconst Close = styled.span`\n position: absolute;\n font-size: 1.8rem;\n right: 20px;\n top: 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n background-color: #fff;\n border-radius: 100px;\n width: 40px;\n height: 40px;\n padding-bottom: 3px;\n filter: drop-shadow(5px 1px 4px rgba(0, 0, 0, 0.2));\n z-index: 10;\n`;\n\nconst ImageWrapped = styled.img`\n max-width: 100%;\n max-height: 100%;\n display: block;\n margin: 0 auto;\n border: none;\n`;\nconst minWidthToShow = 600;\n\nconst Image = styled.img`\n border: 1px solid #eaebec;\n max-width: 100%;\n height: auto;\n\n @media (min-width: ${minWidthToShow}px) {\n cursor: pointer;\n }\n`;\n\nclass ImageModal extends React.Component {\n constructor(props) {\n super(props);\n\n this.state = {\n showModal: false,\n };\n }\n\n componentDidMount() {\n document.addEventListener('keydown', this.escFunction, false);\n }\n\n componentWillUnmount() {\n document.removeEventListener('keydown', this.escFunction, false);\n }\n\n escFunction = (event) => {\n const { showModal } = this.state;\n\n if (event.keyCode === 27 && showModal) {\n this.closeModal();\n }\n };\n\n closeModal = () => {\n this.setState({ showModal: false });\n };\n\n openModal = () => {\n if (window.innerWidth >= minWidthToShow) {\n this.setState({ showModal: true });\n }\n };\n\n render() {\n const { showModal } = this.state;\n const { src, imgStyle, imgModalStyle, alt, title, lazy } = this.props;\n\n const modal = (\n \n ×\n \n \n \n \n );\n\n return (\n <>\n \n {showModal && modal}\n \n );\n }\n}\n\nexport default ImageModal;\n\nImageModal.propTypes = {\n src: PropTypes.string.isRequired,\n imgStyle: PropTypes.oneOfType([PropTypes.object, PropTypes.node]),\n imgModalStyle: PropTypes.oneOfType([PropTypes.object, PropTypes.node]),\n alt: PropTypes.string.isRequired,\n title: PropTypes.string.isRequired,\n lazy: PropTypes.bool,\n};\n\nImageModal.defaultProps = {\n lazy: false,\n imgStyle: null,\n imgModalStyle: null,\n};\n","module.exports = __webpack_public_path__ + \"static/metrics-a61b3bac93db671d8d293a991f1e89d8.png\";","module.exports = __webpack_public_path__ + \"static/filters-221cd3791320792ddbff9acf31367afe.png\";","module.exports = __webpack_public_path__ + \"static/funnels4-ec9681a487046166f87593823f79decd.png\";","module.exports = __webpack_public_path__ + \"static/funnels5-64f579a3df1e776df12af7eb177ab5e9.png\";","module.exports = __webpack_public_path__ + \"static/steps-dc5f8bdb1a0a4540520e3c1f796125ca.png\";","module.exports = __webpack_public_path__ + \"static/funnels2-438beb74407367925336d5a7e15c0f1e.png\";","/* eslint-disable jsx-a11y/anchor-is-valid */\nimport React from 'react';\n\nimport { HelpArticle, SubTitle } from 'components/help/helpArticle';\nimport Image from 'components/help/helpImage';\nimport Link from 'components/ui/link';\n\nimport img1 from 'img/help/how-do-the-funnels-work/filters.png';\nimport img2 from 'img/help/how-do-the-funnels-work/funnels1.png';\nimport img3 from 'img/help/how-do-the-funnels-work/funnels2.png';\nimport img4 from 'img/help/how-do-the-funnels-work/funnels3.png';\nimport img5 from 'img/help/how-do-the-funnels-work/funnels4.png';\nimport img6 from 'img/help/how-do-the-funnels-work/funnels5.png';\nimport img7 from 'img/help/how-do-the-funnels-work/funnels6.png';\nimport img8 from 'img/help/how-do-the-funnels-work/metrics.png';\nimport img9 from 'img/help/how-do-the-funnels-work/steps.png';\nimport img10 from 'img/help/how-do-the-funnels-work/edit.png';\n\nconst Content = () => {\n return (\n
\n What are Funnels?\n

\n A funnel (or a conversion funnel) is a set of actions your user should take visiting your\n website. Each funnel ends with a goal specific to the industry you’re in. For example, if\n you run an eCommerce store, your funnel should end with a purchase. For SaaS, it would be\n subscribing to one of your plans. As an independent consultant, you probably want your\n potential customers to schedule a meeting or at least leave their phone number and email\n address.\n

\n\n

\n Goals may also be specific to the objective you’d like to achieve. For example, if you are\n after getting positive reviews, you would probably start with (1) Showing an NPS, (2) Ask\n promoters to leave feedback, and (3) Gather their feedback through filling a form (which\n will, by the way, be your goal in this three-step funnel).\n

\n\n How to build a funnel\n\n

\n Building a funnel always starts with the end. Think of all measurable effects of your\n visitor’s journey through your website. Write them down. Analyze data from other sources and\n consider what conditions must be met, so your customer reaches the goal. Going down the\n funnel may require visiting a particular set of pages (for eCommerce: Homepage > Category\n Page > Product page > Checkout page > Order confirmation page) or meeting specific\n requirements. If you’re into the SaaS business and want to track switching to higher plans,\n your funnel may look like this: Visit billing page > Click on the “Upgrade Plan” button\n > Mark a checkbox accepting new terms > Making a payment.\n

\n\n

\n In LiveSession, you can use any of our filters (including{' '}\n Custom Events and Custom\n Properties) to create a funnel.\n

\n \"Filters\"\n Building a funnel in LiveSession\n

\n Building funnels in LiveSession is straightforward. First, you have to click on the\n “Funnels” tab in the main menu on the left side of the screen:\n

\n \"LiveSession\n

Then, click on the “New funnel”:

\n \"LiveSession\n

And “Add step”:

\n \"LiveSession\n

Create the funnel you designed and click the “Save” button:

\n \"LiveSession\n How to access the funnels I built?\n

All of your funnels will be available on the left panel:

\n \"LiveSession\n

You can watch sessions of users who reached a specific step in your funnel:

\n \"LiveSession\n How to filter the results?\n

You can also filter the results by specifying a date range and a Segment:

\n \"LiveSession\n How to edit or delete a funnel?\n

\n In order to edit or delete a funnel, use the buttons placed on the upper right corner of the\n screen:\n

\n \"LiveSession\n Can I add another step to a funnel?\n

\n Yes, you can add other steps to your funnels. Click on the “Edit” button, add additional\n steps and click “Save”.\n

\n How can I duplicate a funnel?\n

\n If you want to create a copy of your funnel, click on the “Edit” button and “Save as…” -\n this way you will be able to save it as a new funnel.\n

\n \"LiveSession\n

\n If you want to try Funnels,{' '}\n \n start a free 14-day trial\n {' '}\n or{' '}\n \n log in to your account\n \n .\n

\n
\n );\n};\n\nconst related = [\n {\n link: '/help/how-to-install-livesession-script/',\n title: 'How to install LiveSession script?',\n description: 'Check how can you install LiveSession on any website.',\n },\n {\n link: '/help/how-to-check-if-my-tracking-script-works/',\n title: 'How to check if my tracking script works',\n description: 'Check if your tracking code is installed correctly',\n },\n];\n\nconst Wrapped = HelpArticle(Content);\n\nexport const frontmatter = {\n metaTitle: 'How do the Funnels work?',\n metaDescription:\n 'Learn what a funnel is and know how to use LiveSession Funnels to make your UX research more structured.',\n canonical: '/help/how-do-the-funnels-work/',\n};\n\nexport default () => (\n \n);\n","module.exports = __webpack_public_path__ + \"static/funnels1-8413f6ead7bdc6a5e870c23933a47e26.png\";"],"sourceRoot":""}