Current status of the Ning Platform is always available on the Ning Status Blog.

NC for Hire

Just an easy little plugin to add anywhere inside your community in an HTML module:.

8024414295?profile=RESIZE_710x

Example links to a Codepen to play around with it.

Simply open up a HTML module in the backend or in a Group backend.   Paste the following into the HTML view of the editor.

<style>

@import url("https://fonts.googleapis.com/css2?family=Dosis:wght@600&display=swap");
.board {
font-family: "Dosis";
font-size: 2.2rem;
letter-spacing: .15em;
text-transform: uppercase;
line-height: 1.5;
text-shadow: 1px 1px #666, 3px 3px #000;
width: 250px;
height: 350px;
padding: 20px;
overflow: hidden;
color: #fff;
border: 10px solid #eee;
background: linear-gradient(#0e0e0e 65%, #030303 66%) top 0.03em center/100% 0.3em repeat-y;
box-shadow: 0px -1px 0px 2px #aaa, 0 -7px 5px -5px #000, 0 -15px 30px -15px #000, 0 3px 4px -2px #000, -60px 30px 70px -70px #000, 70px 30px 70px -70px #000, 0px 200px 20px rgba(255, 255, 255, 0.05), inset 0 0 25px #000, inset 0 0 5px #000;
}
.board:focus {
outline: none;
}
.board:after {
content: '';
position: absolute;
width: 100vw;
height: 100vh;
left: 0;
top: calc(50% + 100px);
z-index: -1;
box-shadow: 0 -2px 3px rgba(0, 0, 0, 0.1), inset 0 2px 2px rgba(0, 0, 0, 0.15), inset 0 10px 300px rgba(0, 0, 0, 0.5);
background: #d1a776 url(data:image/png;base64,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) center/5000px 100px;
}
.board:before {
content: '';
position: absolute;
background: url("https://img.teleflora.com/images/o_0/l_flowers:TPL08-1A,pg_6/w_272,h_340,cs_no_cmyk,c_pad,g_south/f_auto,q_auto:eco,e_sharpen:200/flowers/TPL08-1A/Teleflora&#039;sLushLeavesPothosPlant") center/contain no-repeat;
width: 250px;
height: 300px;
left: calc(50% - 370px);
top: calc(50vh - 30px);
filter: drop-shadow(20px 10px 20px rgba(0, 0, 0, 0.3));
}
.board u {
color: #fd0;
text-underline-position: under;
}

body {
background: #666;
display: flex;
align-items: center;
justify-content: center;
min-height: 100vh;
overflow: hidden;
}

</style>

<div contenteditable class="board">
<p>Today is ⛅</p>
<p>Welcome to Student Guide</p>
<p><u>Get Ready</u></p>
</div>

 

The last part contains the words that you can edit to customize it inside your Ning community.  Let me know if you need help with any aspect of your Ning community.

You need to be a member of Ning Creators Social Network to add comments!

Join Ning Creators Social Network

Votes: 0
Email me when people reply –

Replies

  • Very cool way to highlight announcements and new features on a site.  Thank you for sharing.  Now...........wha do I have to tweak to get it to fill a smaller box?   My brain just doesn't work like it used to.  lol

  • Had to remove it, sadly.  It put a dark background behind the entire website and the image wouldn't resize.  I'm bummed.

  • 8075500268?profile=RESIZE_584x
    thanks it would have been perfect but it creates problems for css theme 3.0

This reply was deleted.
 

Some interesting articles related to community management, digital marketing etc. could be found in our digest. Don't hesitate to leave a feedback so we would know that we should continue :-)

Latest Activity

Rosas † Negras replied to ⚡JFarrow⌁'s discussion
Add a Cool Editable Letterboard to your Ning Community
"thanks it would have been perfect but it creates problems for css theme 3.0"
1 hour ago
Rosas † Negras replied to Garfield Archivist's discussion
Ning Billing needs major improvements
"I cannot customize the codes is blocked"
Saturday
Garfield Archivist posted a discussion
I have been with Ning since 2008. What happened to me this morning is cray cray. Full stop. Good…
Friday
Rosas † Negras replied to Rosas † Negras's discussion
Ning Builder-impossible to work on and it doesn't work aspect answer from ning thanks
"thank you very much my dear friend"
Friday
Max Ning Support replied to Rosas † Negras's discussion
Ning Builder-impossible to work on and it doesn't work aspect answer from ning thanks
"Hi,Could you, please, specify what exactly you'd like to change?May I also have a screenshot of the…"
Friday
Rosas † Negras replied to Rosas † Negras's discussion
Ning Builder-impossible to work on and it doesn't work aspect answer from ning thanks
"Max Ning Support hi Max my friend is not working, I am looking forward to your reply when I can…"
Friday
Cindy Dean Mccoy replied to Bizz's discussion
Tip: Remove crop of group cover photo and set a bigger height while making them responsive
"Thank you! Thank you! Thank you!  I knew that dead space at the top was for something.  I just…"
Friday
Max Ning Support replied to Bizz's discussion
Tip: Remove crop of group cover photo and set a bigger height while making them responsive
"Hi Cindy,
Please, make sure that this checkbox is enabled for the Group Hub in your Social Site…"
Friday
Max Ning Support liked Bizz's discussion Tip: Remove crop of group cover photo and set a bigger height while making them responsive
Friday
Cindy Dean Mccoy replied to Bizz's discussion
Tip: Remove crop of group cover photo and set a bigger height while making them responsive
"All I can find is adding is a group image.  Where is it you can add a group cover?  Is ti the huge…"
Friday
Max Ning Support replied to Anastasia_Ning_Support's discussion
Mention feature
"Hi Vander,Thank you for your feedback, we really appreciate it!
I would like to do apologize for so…"
Friday
Max Ning Support replied to Anastasia_Ning_Support's discussion
Mention feature
"Hi, AsilThank you for your question!
I'm really sorry for such a delay. Please, accept our…"
Friday
More…

Meanwhile, you can check our social media channels