WordPress Tutorials by WP101®

WordPress tutorial videos for beginners.

  • Buy Lifetime Pass
  • About WP101
    • Products We ❤️
    • Testimonials
  • WordPress Tutorials
    • WordPress 101 Course
    • WordPress 101: Classic
    • WooCommerce 101
    • Beaver Builder 101
    • Ninja Forms
    • WP Rocket 101
    • Jetpack Plugin
    • Yoast SEO
  • Help Forum
    • Hire a WordPress Expert
    • Contact Us
  • Blog
  • Log In

Possible to change the inline code style?

WordPress Q&A Forum › Possible to change the inline code style?
0 Vote Up Vote Down
GEN LI asked 6 months ago

I use Gutenberg editor write a blog, I see there’s inline code comes really handy whenever I want to put some code inside a paragraph. However, the highlight style I don’t like. Is it possible to customize the appearance of the inline code?

1 Answers
0 Vote Up Vote Down
Best Answer
Shawn Hesketh Staff answered 6 months ago

The highlight style for inline code (and just about every other element on your site) is determined by the stylesheet in your active theme. You can override the CSS style rules for any element, by adding custom CSS to: Appearance > Customize > Additional CSS

Hope this helps point you in the right direction!

GEN LI replied 6 months ago

Yes, you are right sir.
I managed to change it using the following CSS, this may differ for different Themes I guess.

.entry-content code {
font-family:Consolas,”Andale Mono WT”,”Andale Mono”,”Lucida Console”,”Lucida Sans Typewriter”,”DejaVu Sans Mono”,”Bitstream Vera Sans Mono”,”Liberation Mono”,”Nimbus Mono L”,Monaco,”Courier New”,Courier,monospace;
font-style:italic;
color:#00008b;
background:none;
}

Ask a Question

Share this with someone?

FacebookTweetLinkedIn

Most Recent Questions

  • Do WordPress templates offer responsive design? asked by Jennifer Suess
  • How do I create multiple sites? asked by Brett Marshall
  • How do I require individual logins to my site and manage a list of users? asked by Jennifer Suess
  • How to change blog post author asked by William Cardott
  • How do I install the WooCommerce store on the main menu tab of my existing WordPress website? asked by Adair Apple
  • How do I modify the header to display my site title and menu on top of a faint image of my art? asked by Gwyned Trefethen
  • Why don't I have the same image editing features in the image block tool bar shown in the video? asked by Gwyned Trefethen

Hire a WordPress Expert?

Need a quick fix or minor tweak to your WordPress theme? Or a custom feature for your site? Connect with 430 handpicked WordPress experts with just a click!

Chat Now

Site Links

  • About Us
  • Your Account
  • Products We ❤️
  • Affiliates
  • Testimonials
  • Blog
  • Contact Us

Courses

  • WordPress 101
  • WooCommerce
  • Beaver Builder
  • Ninja Forms
  • WP Rocket
  • Jetpack
  • Yoast SEO

Products

  • WP101.com
  • WP101 Plugin
  • Embed our videos on your site!

Connect with Us

  • Email
  • Facebook
  • Twitter
WP101 Membership Card

WordPress Tutorials by WP101© 2008-2021 WP101® LLC, Houston, TX. All rights reserved.
WP101® is a registered trademark with the U.S. Patent and Trademark Office.
Hosted by Nexcess and optimized with WP Rocket.
Privacy Policy | Terms of Use | Disclosure