JenSocial: Social Web Directory and Ning Tips

Social Web Directory :: Social Network Directory :: Ning Tips and Ning Support

How To Add Background Color & Border to Broadcast Message

This question was asked on Creators. It took a while for me to answer it properly. So, it turned into a nice tip!

Instructions:
1. From Manage/Broadcast Message, click on HTML tab. Don't forget to click on this TAB. This is where you want to add your special tags.
2. Add a DIV tag around your entire broadcast message. Starting with <DIV> and ending with </DIV>
3. Within the DIV you can add padding, the background color, a border, etc...
4. Once you get your code the way you want it, be sure to send a preview to yourself.
Note: When you use the hexadecimal value for a color, once you send the preview, the value will change to the RGB colors. This is normal.

I added a blue background with white text, and thick green solid border around the entire box (DIV). And, I added "padding" all the way around, so my text didn't push up next to the color box edges.

I tested this, and even in the free Yahoo Email Box, it worked well.

Here's my sample code:
<DIV style="background-color: #003366; color:#FFFFFF; padding:20px; border:#7b9c3a 4px solid;">Excerpt from Declaration of Independence US<p>When, in the course of human events, it becomes necessary for one people to dissolve the political bonds which have connected them with another, and to assume among the powers of the earth, the separate and equal station to which the laws of nature and of nature's God entitle them, a decent respect to the opinions of mankind requires that they should declare the causes which impel them to the separation.
<br><br>
We hold these truths to be self-evident, that all men are created equal, that they are endowed by their Creator with certain unalienable rights, that among these are life, liberty and the pursuit of happiness. That to secure these rights, governments are instituted among men, deriving their just powers from the consent of the governed. That whenever any form of government becomes destructive to these ends, it is the right of the people to alter or to abolish it, and to institute new government, laying its foundation on such principles and organizing its powers in such form, as to them shall seem most likely to effect their safety and happiness. Prudence, indeed, will dictate that governments long established should not be changed for light and transient causes; and accordingly all experience hath shown that mankind are more disposed to suffer, while evils are sufferable, than to right themselves by abolishing the forms to which they are accustomed. But when a long train of abuses and usurpations, pursuing invariably the same object evinces a design to reduce them under absolute despotism, it is their right, it is their duty, to throw off such government, and to provide new guards for their future security. --Such has been the patient sufferance of these colonies; and such is now the necessity which constrains them to alter their former systems of government. The history of the present King of Great Britain is a history of repeated injuries and usurpations, all having in direct object the establishment of an absolute tyranny over these states. To prove this, let facts be submitted to a candid world.<br>
<br>
</DIV>

Here is the sample result:

Enjoy!

1 member favorited this

Replies to This Discussion

Permalink Reply by Temple of Our Lady of the Moon on February 6, 2010 at 6:43pm

Excellent!

Permalink Reply by Administrator☼JenSocial on February 8, 2010 at 6:29pm

I'll try this one I was tired of the white background. Now we can paint the town RED.

Permalink Reply by JenSocial on February 8, 2010 at 7:06pm

LOL!

Permalink Reply by Kiribati My Homeland on April 3, 2010 at 4:34pm

I just finished doing it. No more white! I've painted the town RED with black boarder! thanx!

Permalink Reply by JenSocial on April 4, 2010 at 12:09pm

LOL, good deal!

Permalink Reply by Martin de Goede on November 27, 2010 at 3:54pm

Is it possible to combine this with this tip ?

http://jensocial.com/group/ningnetworktips/forum/topics/customize-b....

Permalink Reply by JenSocial on November 29, 2010 at 4:30pm

Hi Martin,

This is a good question. But, since we're just wrapping a hard coded DIV around our content within the broadcast message, I don't see a way to mix the two. I wish we could assign a DIV to a class in this case. But I've yet to be able to capture the resulting class or id, after the broadcast email is sent.

Best,

Jen

Permalink Reply by Martin de Goede on November 29, 2010 at 4:43pm

Too bad. I've got a co-worker at DGA Events who is not so familiar with html, CSS etc.

She is however the person who sends most broadcast messages and newsletters.

Combining the two would have been a great newsletter feature from within NING for her.

Permalink Reply by JenSocial on November 29, 2010 at 4:51pm

Martin,

You are right. We really do need this. I will continue to ponder if there is a way.

Best,

Jen

Permalink Reply by Martin de Goede on November 29, 2010 at 4:55pm

Thnx. I'll be waiting to hear what you've come up with. For now I'll save the div-code in a text file and explain to her how to insert the text.

Permalink Reply by Martin de Goede on November 30, 2010 at 9:07am

For now I created a note (the tab to notes is hidden on our site) with two different codes making it possible for her to change background and text colot very easily. We tried test broadcasts and it looks great.

Permalink Reply by JenSocial on November 30, 2010 at 11:56am

Very nice idea. Would love for you to share that in a tip. hint, hint, LOL!

I looked again, and I cannot capture any CSS classes for the broadcast message, sorry.

Best Regards,

Jen