Skip Navigation

[Resolved] Styling “Add new” button for images in the toolset forms

This thread is resolved. Here is a description of the problem and solution.

Problem:

The issue here is that the user wanted to style the add new button on their forms.

Solution:

This can be done by using the some css. Essentially the class that you will need to target with the css is the ".wpt-repadd" class.

You can use this class and add your custom css to the css section of your form.

Here is an example below of some css to change the font size of the button.

.wpt-repadd{
font-size: 30px;
}
This support ticket is created 3 years, 9 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun Mon Tue Wed Thu Fri Sat
- 9:00 – 12:00 9:00 – 12:00 9:00 – 12:00 9:00 – 12:00 9:00 – 12:00 -
- 13:00 – 18:00 13:00 – 18:00 13:00 – 18:00 14:00 – 18:00 13:00 – 18:00 -

Supporter timezone: America/Jamaica (GMT-05:00)

Tagged: 

This topic contains 8 replies, has 3 voices.

Last updated by pramodk-2 3 years, 8 months ago.

Assisted by: Shane.

Author
Posts
#1939401
Repeated image - media library V1.0.png

Hi Team,

In my requirement, adding the repeated images through word press media library.

There is a button "Add new" in order to add more images. However, this looks small and customer may not recognise.

Could you please suggest me the CSS code to make "Add new" button bigger and possibly to style it further.

Thanks.

#1940091

Shane
Supporter

Languages: English (English )

Timezone: America/Jamaica (GMT-05:00)

Hi Promad,

Thank you for getting in touch.

Are you familiar with css ? If so then the class you should be targeting this class below
.wpt-repadd

If you're unsure of how to do this please let me know and I would be more than happy to provide further guidance.

Thanks,
Shane

#1940093

Thanks Shane,

Please provide me the CSS to make the size bigger using the class provided.

I will try the other stylings.

Also, will the styling be applicable to all the browsers when we target the class provided ?

Thanks.

#1940099

Shane
Supporter

Languages: English (English )

Timezone: America/Jamaica (GMT-05:00)

Hi Pramod,

Here is an example for the font size.

.wpt-repadd{
font-size: 30px;
}

This should get the font size up for you.
Thanks,
Shane

#1940103

Thanks,

Will this be applicable to all the browsers ?

Thanks

#1940943

Shane
Supporter

Languages: English (English )

Timezone: America/Jamaica (GMT-05:00)

Hi Pramod,

Yes that is correct. The css that I provided will apply to all browsers, unless there is a conditional style for a specific browser it will apply to all.

Have you added the css to the form and check if it loads the correct font size ?

If you are experiencing any issues please let me know.

Thanks,
Shane

#1944147

Hi Shane,

Thanks. I will check and update you on this by this Sunday.

Thanks.

#1951487

Nigel
Supporter

Languages: English (English ) Spanish (Español )

Timezone: Europe/London (GMT+00:00)

Hi there

Shane is on vacation this week.

Did you check you site in light of what Shane replied?

If everything worked out okay, please go ahead and mark this as resolved, thanks.

#1951491

My issue is resolved now. Thank you!