free message notification: “Hey. How you doin?”

Yzma Krunk“Hey. How you doin?”

Joey from friends saying:
“Hey. How you doin?”
Right click HERE to download.
Listen:

CLICK HERE for a complete listing of Free Ringtones.

html: prevent line break after text link

preventlinebreakafterlinkwith_inlineThe problem:
Creating a text link seemingly inserts a line break and causes the text following the link to wrap to the next line. Notice the second paragraph is not a link – and it doesn’t wrap.

This is what the original code looks like:
preventlinebreakafterlinkwith_inline_codebefore

To prevent the text from wrapping/inserting a line break, add an inline property to your anchor tag.

Here’s what the inline property looks like:
preventlinebreakafterlinkwith_inline_codeafter

preventlinebreakafterlinkwith_inline_finalAnd here’s the result:
I know the font size of the link is slightly larger than the paragraph text. I’ll be fixing that next.

html lists: indent spacing and change bullet styles

Working on my website recently and created a multi-level unordered list. The spacing of the second level indent was much more than I needed and I wasn’t loving the fact that the bullets were the same for both levels.

I found code to solve both those problems, so as usual, I’m posting it here for my future reference and, hopefully, to help someone else looking to solve the same problems.

I changed the second level bullet style to square and reduced the second level indent to 15px. Here’s a screen shot of my final list, followed by the code snippets I used:

Continue reading “html lists: indent spacing and change bullet styles”

html: add a mouse hover “tooltip” to a link.

Here’s a little code snippet you can add to a link so that when someone hovers their mouse over the link, a “tooltip” is displayed, giving them more information. In the example shown below, the image of Dorothy looking out her window is a link to download an audio clip of the theme of the Wicked Witch. The tooltip I added displays the target post’s title “free ringtone: wicked witch of the west” when the mouse hovers over the image.

A simple way to add a tooltip to an image link is to add the following code immediately following the link target:

<span title=”your tooltip language goes here”></span>

For an example of how this was used in the image above, check out the sample code below.
The tooltip code appears highlighted on line 4:

<a href="https://pragmaticcomputing.wordpress.com/
2016/08/24/html-add-a-mouse-hover-tooltip-to-a-link/
wordpress-post-displaytooltiponhover/"> 
<span title="free ringtone: wicked witch of the west">
<img class="alignnone size-large wp-image-685" 
style="border: 1px solid #000000;" 
src="https://pragmaticcomputing.files.wordpress.com/
2016/10/wordpress-post-displaytooltiponhover.png?
w=474" width="474" height="700" /></span></a>

As you might expect, the tooltip code isn’t limited for use with an image link. It can also be used with a text link, again, just by adding it immediately following the link target and before the </a>
(hover over the following text to view the tooltip)

Wicked Witch of the West Theme Song

Here’s what the code from the above text link looks like:

<a href="https://pragmaticcomputing.wordpress.com/
2016/08/24/html-add-a-mouse-hover-tooltip-to-a-link/
wordpress-post-displaytooltiponhover/"> 
<span title="free ringtone: wicked witch of the west">Wicked Witch of the West Theme Song
</a>

To add a tooltip to plain text, it’s even simpler:

<span title=”your tooltip language goes here”>Text to be hovered over.</span>

free ringtone: wicked witch of the west

Wicked Witch of the WestWizard of Oz:

No lyrics, just the foreboding, iconic music announcing the arrival the Wicked Witch of the West. Or in this case, announcing the phone call of…someone you love. Right click HERE to download.
Listen:

CLICK HERE for a complete listing of Free Ringtones.

free ringtone: Friends Theme Song

Friends Fountain PhotoFriends Theme Song:

First few seconds of the theme song to Friends by The Rembrandts
Right click HERE to download.

Click Below to Listen:

CLICK HERE for a complete listing of Free Ringtones.

Back to the Future Twinkle

Back to the Future TwinkleBack to the Future:

The perfect message notification for Back to the Future Day. The twinkle/chime sound that indicates something has changed.
Right click HERE to download.

Listen:

CLICK HERE for a complete listing of Free Ringtones.

Haunted Mansion Doorbell Message Notification

Haunted Mansion Doorbell:


A perfect message notification for Halloween!
Or any other creepy time of year.
Right click HERE to download.

Listen:

CLICK HERE for a complete listing of Free Ringtones.

create faux letterhead for fax and pdf attachments.

Historically, I’ve created faux letterhead to be used when letters were to be sent via fax. More recently, they are used for letters to be sent as PDF attachments via email.

The reasoning behind this is to save money on pre-printed stationary letterhead. Economically, there’s no reason to print a letter on this expensive paper when the recipient will never actually touch it.

First, I re-create the content and format of a client’s pre-printed letterhead using the same fonts and layout as the printed version. The goal is that the recipients of these letters won’t notice a difference between the paper letters they receive from a firm via USPS and the letters they receive from the same firm via fax or email.
Continue reading “create faux letterhead for fax and pdf attachments.”

free message notification: Bewitched Nose Twinkle

Bewitched Nose Twinkle“Bewitched Nose Twinkle”

The twinkle noise when Samantha twitches her nose on Bewitched.
Right click HERE to download.
Listen:

CLICK HERE for a complete listing of Free Ringtones.

(Disclosure: The image link above is an affiliate link, meaning, at no additional cost to you, I will earn a small commission if you click through it to buy the DVD.)