Skip Navigation

[Resolved] Glyphicon assistance

This support ticket is created 5 years, 7 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.

This topic contains 3 replies, has 2 voices.

Last updated by Nigel 5 years, 7 months ago.

Assigned support staff: Nigel.

Author
Posts
#484954

I am trying to: add glyphicons to buttons in a cred form (id: 1237)

I believe I followed the tutorial correctly, but they don't seem to be showing up.

Can you please check and see if I'm implementing the code correctly.

#484967

Nigel
Supporter

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

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

Hi Jon

I looked at form 1237 and I can't see any sign of anything you have done to add the icons to the buttons.

Can you tell me what you have done and which tutorial you were following.

As you cannot modify the markup CRED generates for the fields and buttons, I would expect you to need to add some custom JS that modifies the form markup once it has been generated, but I'm not seeing any of that—nor anything else.

#485077

Sorry NIgel,

It's in the view (new-manager-team-list-view) which is above the form that has the code to add the glyphicons to the buttons.

<button type="button" class="btn btn-default" aria-label="Left Align"><span class="glyphicon glyphicon-edit" aria-hidden="true"></span>[cred_link_form form='1415' form_name='New Edit Team Photo Member' text='Edit' target='_self']</button>

The tutorial is found on the "Learn How to Use Bootstrap in layouts" link when you click on the bootstrap button element.

#485106

Nigel
Supporter

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

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

Hi Jon

Thanks for the clarification, it helped me track down where I was expecting to see the icons used and appear.

On a page on the front-end where I would expect to see them (e.g. hidden link) they are not, and they are not because your theme is not loading Bootstrap and so the glyphicons are unavailable.

See the screenshot from the browser console which shows the stylesheets loaded on the page—Bootstrap is notably absent.

You will have to enqueue it yourself (read about enqueuing stylesheets in the official WordPress theme developers handbook: https://developer.wordpress.org/themes/basics/including-css-javascript/).

Or if you just need a few icons, you can take advantage of the built-in dashicons in WordPress, which you can read about here: https://developer.wordpress.org/resource/dashicons/

I added a sample line of text with a dashicon to your view so you can see what is involved.