Support › MB Settings Page › Applying class to output
- This topic has 6 replies, 4 voices, and was last updated 6 years, 7 months ago by
janek.
-
AuthorPosts
-
August 23, 2017 at 6:37 AM #6727
janek
ParticipantHi all,
Trying to style an output that uses the Metabox shortcode:
[rwmb_meta meta_key="text_6" type="text"]
I tried the class value in advanced but my understanding is that this only applies a class to the backend metabox not the output on the frontend.
Is there any way to style a shortcode output on the frontend in settings or elsewhere?
August 23, 2017 at 9:08 AM #6729Truong Giang
ParticipantHi there,
You can use something like this:<div class="anyclass"> [rwmb_meta meta_key="text_6" type="text"] </div>August 23, 2017 at 9:21 AM #6730ParticipantHi Truong,
Is it possible to make it so the class CSS styling doesn't apply when the shortcode value is empty.
For example I have multiple shortcodes for metaboxes sitting in a widget, without assigning a class to apply padding above each shortcode the outputs run into each other. However if I apply a class and style it with padding above the problem then is if I dont have a value/output for one of the metaboxes it still applies the css padding which leaves a gap between the shortcodes.
I've taken a screenshot of the backend and the frontend metaboxes I'm using
You can see I haven't populated the Videos metaboxs and thats causing a huge gap to appear between the forms and the links due to the padding I've added to the shortcode.
August 23, 2017 at 4:41 PM #6734ludovic.meyer
ParticipantHello Janek,
I think you can use Truong solution in addition with the :empty css selector
.anyclass { padding: 10px; } .anyclass:empty { padding: 0; }That should work.
Or you can create your own shortcode which verify the content of rwmb_meta before display it.
Hope it helps
August 25, 2017 at 10:43 PM #6765Anh Tran
Keymaster@ludovic.meyer: Cool trick! Thanks.
August 26, 2017 at 10:32 AM #6773ParticipantThanks Ludovic, I'll try this when I'm back at work on Monday. 🙂
September 5, 2017 at 8:38 AM #6875ParticipantThat worked perfectly. Thank you. 😀
-
AuthorPosts
- The topic ‘Applying class to output’ is closed to new replies.