Showing posts with label Posts - Formatting. Show all posts
Showing posts with label Posts - Formatting. Show all posts

Not Letting Text Wrap to a New Line

Even on a fixed-width blog, you never know for sure where line breaks will occur on the visitor's computer.

What if you have a short sentence or phrase that you want to always remain on the same line?

In other words, you don't want the text to ever wrap or be split between two lines.
Notice that neither of the two phrases in green below stay on the same line:

Developers should customize the line of code @template = hr(apache.org.us 222.333.222.00 localhost); and also customize the line of code @template = hr(apache.org.us 222.333.222.00 localhost);.


What do you do if you have a phrase that you do NOT want to be split on two different lines? Use the CSS white-space property.

The CSS white-space Property

This property has several values, but the value that fixes our problem is no-wrap. Just use the SPAN tag before and after the phrase as follows: <span style="white-space:nowrap">Your Phrase Here</span>. (For CSS users, create a class to use in the span like so: .nobreak {white-space:nowrap;}


Fixing the Problem Using no-wrap

To fix the problem, wrap the two phrases with spans using "no-wrap" as shown above:

Developers should customize the line of code @template = hr(apache.org.us 222.333.222.00 localhost); and also customize the line of code @template = hr(apache.org.us 222.333.222.00 localhost);.


The Code for the no-wrap Example:


Developers should customize the line of code <span style="white-space:nowrap">@template = hr(apache.org.us 222.333.222.00 localhost);</span> and also customize the line of code <span style="white-space:nowrap;">@template = hr(apache.org.us 222.333.222.00 localhost);</span>.




If this post has been helpful, please consider linking to our blog or sharing!  Bookmark and Share

How to Remove Name and Date from Blog Post

If you do not want your name and date posted on the bottom of each blog post, follow these instructions to remove them. It is very easy!

  • Go into your blog and click Layout.

  • On the Blog Posts box, click Edit in the lower right corner.

  • Remove the check marks from the first 3 options as shown in the photo below.

  • Then click SAVE at the very bottom.


Wasn't that easy?

If this post has been helpful, please consider linking to our blog or sharing!  Bookmark and Share

How to Remove Label From Displaying Below Posts

To remove the label from showing at the bottom of a post, you must edit the HTML. Go into Theme and click Edit HTML.


Don't forget to first Download Your Theme (Template). The current theme should always be downloaded and saved to hard disk in case the html gets messed up and you need to put back the code.

Once you are in the HTML, Blogger often hides some of the code and you must click the black arrow in between the row number at the far left and the actual code.

Early on, most templates or themes used the code below. Recently we had to hide the labels on one of the "Simple" themes and the code was still almost identical and it worked successfully.

So carefully following the directions below..

Click in the HTML, then press Ctrl+F on the keyboard to open the "Find" box in the upper right corner of the HTML window. Start typing the following: cond='data:post.labels inside the box and press Enter. Be careful. If Blogger can't find what you've typed and you press Enter, it may start adding blank lines in the HTML, which you don't want.

Hopefully you'll find the code below. When you do, delete ONLY the lines highlighted in red. If your code isn't exactly as below, but you feel it is close, delete the code but place it in a text (Notepad) file and save it in case you need to put it back.

<div class='post-footer-line post-footer-line-2'><span class='post-labels'>
<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>
</b:loop>
</b:if>

</span> </div>

Only delete the lines highlighted in red! And your labels will disappear. Cheers!