I have been, or can be if you click on a link and make a purchase, compensated via a cash payment, gift, or something else of value for writing this post. Regardless, I only recommend products or services I use personally and believe will be good for my readers. Please read my full Disclosure for more information.
(Even if you are using Gutenberg!)
This is going to be a really quick post! I just have to share RIGHT NOW!
When I started out blogging, I found out really quickly that hiding the extra graphics for future pinning or sharing within your post was the cat’s “meow”.
Doing this made sure that your post wasn’t all clogged up with your hopefully-to-be-scheduled-the-near-future pins and that it stayed clean and uncluttered.
Enter Gutenberg Editor for WordPress
I loved it! Blocks, simplicity – it had all the conveniences. And, I was a newbie blogger and the classic mode wasn’t necessarily “stuck” on me.
The only problem. And let me tell you, it was a big one. No matter what I tried, I could not get my graphics to hide the way I had learned in the classic editor.
Every other blogger I have talked to is scared to transition. I have asked around in Facebook groups and search on Google. There are no answers (that I can find anyway). Either this is a really big secret or no one really knows how.
And totally I can see why bloggers are afraid to take the leap over to Gutenberg. JUST BECAUSE OF THIS! Pinterest is how the majority of bloggers get their material out there. There is no time to deal with things not working- we are busy enough.
But, there is a way, and I have found it!
When I first moved over to Gutenberg, I tried to add in the code that promised me that my graphics would hide away in Classic mode but nothing would work when I tried.
Uggghhhh. Back to the drawing board.
So.. today I got an email from a fellow blogger trying out my batch blog content mini challenge and she asked how to hide her images.
So, I got home and did what I thought was natural. I poured a glass of wine and stared at the HTML. I’ll be honest here. I was kinda hoping it would magically appear, I guess.
All of a sudden, it came to me- it was different. The code I added in Classic came before some other code that looked like it may be an image and after something that made it seem like a picture. (This is as technical as I can get on this one). Told ya I’m not tech-smart.
All I needed to do was remove the “block” code that was added in before and after the image code. VOILA! Pictures are now hidden!!
I can’t believe I didn’t figure this out sooner!!
And now I am writing this post in warp speed and my fingers feel like they are going to fall off because I feel for the thousands of other bloggers who just couldn’t get it and need HELP!
It’s here!! This is how!!
Here’s a video I made explaining it…
And, here’s the code I used to do it:
First insert before in the front of the image: <div style=”display:none;”>
Then, at the end of the HTML for the picture: </div>
If you’ve worked with this before in Classic mode, notice- same code as before, you just have to remove the block coding before the image coding to make it work. TAAADAAAAA!
And THAT.. Deserves an extra glass of vino.
If you are looking to amp up your Pinterest game, check out a review I did on the Pinterest Ninja
Happy Pinning Everyone!!!
Check out some of my other posts here:
- How to Make Money and Protect Yourself Legally as a New Blogger
- Gutenberg Block Editor for WordPress: How to Use Blocks & Time Saving Tips
- WordPress.com vs WordPress.org: What’s the Difference and Why it Matters for Your Blog
- 5 Things You Should Know to Start a Successful Blog
- How to Have a More Successful Blog with Batch Content Creation