More Little Whiz Bang Gadgets and Other Stuff to Jazz up Your Post!

in steemit •  7 years ago  (edited)

More little whiz bang gadgets and stuff to jazz up your post!

Greetings my friends, if you have been following me you will remember a couple of tricks to manipulate the way your pictures behave in your post. I'll recap a couple here. You can cut and paste the type in the grey slider lines right into your text editor to work with it.

U5dr3coebULP6jZJyTLpwZMUat9Bk78_1680x8400.png

This string will center your text or picture:

<center>Your Text or Image File Goes Here</center>


This string will wrap your blog text to the right side of your pictures and pull the image left:

<p><div class="pull-left"> Image File Goes Here</div>


This string will wrap your blog text to the left side of your pictures and pull the image to the right:

<p><div class="pull-right">Your Image File Goes Here</div>

Suppose you want to pull your

text lines over to the right of the screen and
make them raggedy on the left
like this.

This string will move your text to the right side of the screen:

<div class="text-right">Your Text Goes Here</div>

Suppose you want to pull your

text lines over to the left of the screen and
make them raggedy on the right
like this.

This string will move your text to the left side of the screen:

<div class="text-justify">Your Text Goes Here</div>

Suppose you want to pull your

text lines to the center of the screen
and
have them
align
like this.

This string will move your text to the center of the screen:

<div class="text-center">Your Text Goes Here</div>

Remember to hit the return key to position your new line of text in the examples above.


Pretty neat, Huh?


Have you noticed that when you paste a picture into your blog there are no breaks above and below it?
None here!

And none here either!!!!

To make a space above and below a picture use this line:
<br><center>Paste Your Picture Here</center><br>

Like below.

Notice how the random text is spaced above and below the picture?
Be sure to look close.

Random text random text random text Random text random text randomRandom text random text random textRandom text random text random textRandom text random text random text Random text random text random text Random text random text random text random text Random texy ourdam winn ernfi rstt commen teth atnfin dsxt hisdge tse. dfiv e dsbd ext Random text random text random text Random text random text randomRandom text random text random text random text



Random text random text random textRandom text random text random textRandom text random text random text Random text random text random text Random text random text random text Random text random text randomRandom text random text random text random text random text random text

This is really useful when adding a caption!

To make a caption under your image use the following code:

<br><center>Your Image Goes Here</center>
<center>Your Caption Goes Here</center><br>

And it will look like this!



My Caption

Neat Stuff, Huh?

If you need to display html code in your blog, like I'm doing here, type four spaces ,then the code, and it will create a grey slider bar that won't execute the code you are trying to explain in your blog.

For example, in order to show you how to type the next line in the text box I made this slider bar.

<center>Your Image Here</center>

Have you ever wondered how to make those faint gray separators between text like the one above? That's just 3 underscores and a return!

But I've found something way better, some people call them bars, some call them separators or rulers. I've been collecting them. Hit me up if you know some good ones or put them in the comments for all to share!

Here's my favorite:

Here are some more:

DQmfSbamV6Tpsf4SHYTHLmvz41YQWSGBFxGizYZQeFVPdue.png

U5dr3coebULP6jZJyTLpwZMUat9Bk78_1680x8400.png

I found these in old Steemit post by:

@byn

And

@cryptosharon

These girls are awesome Steemians and I would urge you to look them up, find their latest post, and give them some love!

SMASH DAT UPVOTE BUTTON ON THEM!!!


How about those neat gifs at the end of some of these more sophisticated blogs urging you to upvote, resteem and follow?

I'm not certain, but I think as long as the Steem or Steemit logo is included it should be okay to use. I know the one I use at the end of my post is a freebie. To get these, all you have to do is save the gif to your computer by right clicking on them and selecting the save or save as feature. I'm starting a collection of these too, for future use. Hit me up in the comments if you come across a stash of them!


How about banners to spiffy up the ole blog page?
DQmYjezFS9f1czr5cznih9oP56qRJdRMsBoWsrwDbbjZbP1_1680x8400.jpg

Try this guy! He's amazing!

@jackjohanneshemp
Send him some love too!


Would you like to incorporate emojis into your comments and post?
Of course you would!
Check out this master list of emoji codes by:
@blueorgy

Send Love, tell them
@beekerst
sent you!!
And
CARRY ON!



Authors get paid when people like you upvote their post.
If you enjoyed what you read here, create your account today and start earning FREE STEEM!
Sort Order:  

Your post was resteem by Whale ResteemService @booster007 & @boostupvote
Resteem Over 10,200+ Followers

Keep it up!
All the best!

Send 0.100 SBD/steem For resteem over 4300+ followers / send 0.200 SBD/steem resteem over 10,200+ Follwers Send your link in memo ! @boostupvote Attached !

gran post , mejor edición

  ·  7 years ago (edited)

¡Muchas gracias, eres muy amable! ¡Aprecio el voto a favor y el resto! Muchas gracias de nuevo!
CARRY ON!

Random text random text random text Random text random text randomRandom text random text ???

  ·  7 years ago (edited)

A method to my madness???? And it demonstrates the way text is spaced between a picture.

Thanks for a great post! I'm sure it will be greatly appreciated by many!

I hope so......I'm still learning and I try to share what I know.

You got a 34.10% upvote from @upmewhale courtesy of @beekerst! Earn 90% daily earning payout by delegating SP to @upmewhale.

You have been resteemed by @resteemy, courtesy of @beekerst!
Want to increase your following? Read more about me here

Thanks for the coding @beekerst. It's very helpful.

You're welcome!

Thanks this is really useful.

I'm glad you found it useful!

Great help! Thank you very much!

Glad you found it useful!