Shortcakes suddenly not working

Greetings Djaspow,

The shortcodes have updated in this new version, you just need to update them. Please read out Knowledge Base article for more details: https://yikesinc.freshdesk.com/support/solutions/articles/6000067427-upgrading-to-version-6-changes-from-version-5-4-4

Thank you!
-Tracy

I have updated the shortcodes but then yet all my custom styling is gone, and im not able to do it myself.
what can i do to recover the custom styling my designer did for me?

I am not sure why the styles are missing, because we did not change names of the CSS classes, but I can give you some CSS code to drop in your theme to style the form.

Do you want it to look just like this other form on your site?
https://cloudup.com/cIhElidJWM3

Let me know. Thanks!

Yeah exactly! that would be great!

Great! Just update this shortcode https://cloudup.com/iOyLUjh4AN2
And I’ll put those styles together for you.

Cool site, btw.

Hi tracy, Thanks!

I put in the code:)

I still see the old code there.

My bad, had to empty the caches for you to see.
now it should be there

Sweet! Ok, I just need you to do one more thing.

I need you to set the placeholders for the fields and hide the field labels.
This just means the text will show up in the field instead of above it.

Here are instructions on how to do that: https://cloudup.com/iI7lFvDUoEa

Thanks for your patience!
-Tracy

Done!

Thank you. Code coming right up…

Hello.

Here is a first pass, it may take a little back and forth to get it perfect.

This is what it looks like on my end: https://cloudup.com/if7PLOUvzw6

You will need to add this CSS code to your theme’s style sheet.

The way to do that will vary. If you built your own theme or are using a Child theme you just add it to the style sheet. If you bought or downloaded a theme, look for a place to add “Custom CSS.” If that is not available you can use a free plugin like Jetpack or Simple Custom CSS to add it.

.yikes-easy-mc-form .yikes-easy-mc-submit-button {
    background-color: #E6F132;
    border: 1px solid #282828;
    color: #000 !important;
    font-family: "Open Sans",sans-serif;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 13px;
    font-weight: 600;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    box-shadow: none;
    text-shadow: none;
}

    .yikes-easy-mc-form .yikes-easy-mc-submit-button:hover {
        color: #fff!important;
        background-color: #282828!important;
        border-color: #111;
    }

.yikes-easy-mc-form input[type="text"], .yikes-easy-mc-form input[type="email"] {
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.428571429;
    color: #555 !important;
    vertical-align: middle;
    background-color: #FFF;
    border: 1px solid #CCC;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -moz-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    background-image: none;
    text-shadow: none;
}

.yikes-easy-mc-form input[type="text"] {
    margin: 10px 0px 16px 0;
    width: 49% !important;
}

.yikes-easy-mc-form input#FNAME {
    float: left;
}

.yikes-easy-mc-form input#LNAME {
    float: right;
}

That looks a lot better already.
Final weeks:
I removed the last name field, im sorry i didn’t notice that before
There could be a little more space between the field and the submit button.

Thank you so much for helping me like this!

No problem, I’m happy to help.

Give this a try:

.yikes-easy-mc-form .yikes-easy-mc-submit-button {
    background-color: #E6F132;
    border: 1px solid #282828;
    color: #000 !important;
    font-family: "Open Sans",sans-serif;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 13px;
    font-weight: 600;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    box-shadow: none;
    text-shadow: none;
}

    .yikes-easy-mc-form .yikes-easy-mc-submit-button:hover {
        color: #fff!important;
        background-color: #282828!important;
        border-color: #111;
    }

.yikes-easy-mc-form input[type="text"], .yikes-easy-mc-form input[type="email"] {
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.428571429;
    color: #555 !important;
    vertical-align: middle;
    background-color: #FFF;
    border: 1px solid #CCC;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -moz-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    background-image: none;
    text-shadow: none;
    margin: 10px 0px 20px 0;
    width: 49% !important;
}

.yikes-easy-mc-form input[type="email"] {
    float: left;
}

.yikes-easy-mc-form input#FNAME {
    float: right;
}

I implemented it on all of my pages and it looks very nice
Thanks a lot for your service and advice.
Even though i hated the fact that i had to change all of my shortcakes again you helped me out a lot!

Thanks!
Topic can be closed in my opinion