8 Replies Latest reply on Mar 17, 2017 10:24 PM by Sanford Whiteman

    switch out token, template form

    Charles Sanderson

      I had an idea to limit the number of forms we use, with a template form (based on fields needed, rather than use-case), but I ran into a hiccup.

       

      Because the form could be used in multiple programs, I made the submit button text a token - so that I could drop the form into a landing page, and change submit button text locally, in the program. But...then I encountered a situation where the same form is used twice within a program on different landing pages, and the submit button text needs to be different. Doh!

       

      Is there a way to switch out the token for another from within the program? Or some other way to control that submit button text from within the programs? Anything, so I can continue to use a single form with ability to change the submit button text for each landing page it might be on.

        • Re: switch out token, template form
          Grégoire Michel

          Hi Charles,

           

          Yes, this is possible, but it will take some JS. You could even for instance use a variable in the landing page and have a JS script use the value of this variable to set the button label. This would have to be done at LP template level. The beauty is that for the cases where you only have 1 form in the program, the default value for the variable would simply be the token.

           

          -Greg

            • Re: switch out token, template form
              Sanford Whiteman

              Or the CSS-only version, which I like because then you don't have to worry about event timing. Set the default button text on the form to a space or zwsp:

               

               

              Then it's all CSS from that point:

               

              .mktoForm .mktoButtonRow BUTTON[type="submit"]:after {
                  content: "Do It Now!";
              }
              

               

              Then you can use CSS selector specificity to change the button (in addition to variables, tokens and such):

               

              BODY[id="landing-page-01"] .mktoForm .mktoButtonRow BUTTON[type="submit"]:after {
                  content: "Go Ahead!"; /* change the button text for one LP only */
              }
              
              #mktoForm_1234 .mktoButtonRow BUTTON[type="submit"]:after {
                  content: "Make My Day!"; /* change the button text for one form ID only  */
              }
              
            • Re: switch out token, template form
              Charles Sanderson

              Yep! That works!  I went with the CSS approach.

               

              I added it to the template like so (for some reason, "BUTTON[type="submit"]" didn't cooperate) ... the specific form id is intentional in this case:

              #mktoForm_2036 .mktoButtonWrap.mktoSimple .mktoButton:after {

                  content: "${submitbuttontext}" !Important;

              }

              and:

              <meta class="mktoString" id="submitbuttontext" mktoName="Button Text" default="{{my.Submit Button 1 Text}}">

               

              I can edit the variable, to use a different token, or simply put in one-off text. Just the flexibility I needed! Thank you!