...
Furthermore, you can also choose whether you want the same button style for your desktop and mobile forms. To change the button in your mobile form, under the ‘Form’ tab, go to ‘Mobile’. Here you can also adjust the breakpoint; the maximum screen size for which your form will be shown in mobile view, its default value is 544px.
...
Once you've selected the position and style of your feedback button, don't forget to click on the 'save button' in the top right corner. You can, thereafter, see the result by clicking the blue "preview" button.
Change feedback button position with CSS
In your feedback form, go to ‘Design’>'Form'. Below, you will have the option to add custom CSS. To change the location of the slide-in button, add the following code:
| Code Block |
|---|
.mopinion-survey-content button.btn.btn-open-slider{
padding-right:90px!important;
} |
Video Walkthrough
...
| Easy html macro |
|---|
| theme | {"label":"solarized_dark","value":"solarized_dark"} |
|---|
| contentByMode | {"html":"<div id=\"surveyContent\"></div>","javascript":"var confluenceData = {};\nvar pageId;\nvar pageTitle;\n\ntry {\n confluenceData = JSON.parse(parent.window.name);\n var pageId = confluenceData.options.productContext['page.id'];\n var pageTitle = confluenceData.options.productContext['page.title'];\n} catch(e) {}\n\nvar src = 'https://collect.mopinion.com/assets/surveys/2.0/js/survey.min.js';\n\nvar vars = {\n key:'211a4fdb96626776846147095cc335b448e20458', \n domain:'app.mopinion.com', \n divName:'surveyContent', \n button:false, \n use_collect:false, \n useQuerySelectorAll:false\n};\n\nvar s = document.createElement('script');\ns.async = 'async';\ns.id = 'mopinionFeedbackScript';\ns.src = src;\ns.onload = s.onreadystatechange = function() {\n if (!s.readyState || s.readyState === 'loaded' || s.readyState === 'complete') {\n try {\n srv.loadSurvey(vars);\n } catch (e) {}\n }\n}\ndocument.head.appendChild(s);","css":""} |
|---|
|
|