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

NC for Hire

I've been creating topics pages inside my community and if you are doing something similar, having a different Hero style header (example). In brief, topics pages aggregates photos by tag or category, discussions by tag or category,videos by tag or category, etc.

hero image tip for Ning communities

Embedded here is the pen for you to fork and play around with for your community, but i will save you some time if you wanna try it out.

See the Pen Hero Section with Text Overlay by JFarrow (@JFarrow) on CodePen.

The time saver. Simply copy and paste the following code into a notepad to alter it before installing it. Replace the underlined image URL with your own image URL and change the text for title and subtitle.

<style>.hero {
background: linear-gradient(#0006, #0006), url(https://storage.ning.com/topology/rest/1.0/file/get/3822778870?profile=RESIZE_1200x);

background-position: bottom;
background-size: cover;
background-repeat: no-repeat;
height: 70vh;
/* background-color: #eee; */
display: flex;
justify-content: center;
align-items: center;
}

.hero-inner {

/* text-align: center; */
padding: 0 1.5rem;
}

.hero-headline {
margin: 0;
color: #fff;
font-weight: 400;
}

h2 {
margin: 0;
color: #fff;
font-weight: 400;
font-size: 1.2rem;
}


</style>
<header class="hero">


<div class="hero-inner">

<h1 style="font-size:2em;"class="hero-headline">Your  Title</h1>
<h2>A curated collection of blah blah blah.</h2>

</div>

</header>

 

 

Once you have it the way you want it, simply copy and paste it inside a Below Header HTML module like so:

3822790979?profile=RESIZE_710x

 

If you have trouble, let me know.  If you need help with your community, let me know.  Happy to help.

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 –
 

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

Alex - Rosas † Negras replied to Bernard Lama's discussion
Why Ning Creators is So Inactive ? Possible Reasons ?
"👍thank you my brother and sorry for my words"
1 hour ago
Bernard Lama replied to Bernard Lama's discussion
Why Ning Creators is So Inactive ? Possible Reasons ?
"Thanks buddy, I will try to come here  as much as I can."
4 hours ago
Eva and Amit Sinh are now friends
8 hours ago
Eva liked Bernard Lama's discussion Why Ning Creators is So Inactive ? Possible Reasons ?
21 hours ago
Alex - Rosas † Negras liked Bernard Lama's discussion Why Ning Creators is So Inactive ? Possible Reasons ?
yesterday
Alex - Rosas † Negras replied to Bernard Lama's discussion
Why Ning Creators is So Inactive ? Possible Reasons ?
"the reason that many people like you available to everyone and the community have disappeared, so…"
yesterday
Bernard Lama posted a discussion
Hi Folks,It's been a long time since we last saw each other here, I was so busy with local…
yesterday
Bernard Lama and Amit Sinh are now friends
yesterday
Ning test2 and Ning test joined Ning Creators Social Network
Saturday
Alex - Rosas † Negras replied to Joven's discussion
who with newtork 2.0
""
Saturday
Alex - Rosas † Negras replied to Joven's discussion
who with newtork 2.0
""
Saturday
Margarida Maria Madruga replied to Joven's discussion
who with newtork 2.0
"I asked about something else, but I understood you.So, what can I do on the site to send messages,…"
Friday
More…

Meanwhile, you can check our social media channels