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

Forum

NC for Hire

Hi folks,

You must have seen my previous tip "Youtube Like Pagination". In addition to that, I'm going to show you how to make search bar more attractive and matching with youtube like pagination.

Simply copy and paste the following code into advanced CSS box. That's it. 

If search image link is broken, please find the attached file and download it. 

Keep adding and keep enjoying. Subscribe to tips for NCs for more.

Also you can contact me for better network customization and other ning stuff @ bernardmax@gmail.com

The Code 

<!-- SEARCH BAR CUSTOMIZATION BEGIN -->

.module_searchbar .xg_module_body {
-moz-box-shadow: inset 0 1px 5px rgba(0,0,0,0.25),0 1px 0 #fff;
-ms-box-shadow: inset 0 1px 5px rgba(0,0,0,0.25),0 1px 0 #fff;
-webkit-box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.25),0 1px 0 white;
box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.25),0 1px 0 white;
filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#ffc8c8c8,EndColorStr=#ffe6e6e6);
background-image: -moz-linear-gradient(top,#C8C8C8 0,#E6E6E6 100%);
background-image: -ms-linear-gradient(top,#C8C8C8 0,#E6E6E6 100%);
background-image: -o-linear-gradient(top,#C8C8C8 0,#E6E6E6 100%);
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,#C8C8C8),color-stop(100%,#E6E6E6));
background-image: -webkit-linear-gradient(top,#C8C8C8 0,#E6E6E6 100%);
background-image: linear-gradient(to bottom,#C8C8C8 0,#E6E6E6 100%);
}

.module_searchbar .xg_icon-search {
background: url(http://api.ning.com:80/files/BGFE84IJT1uV9RBHKKRGAVdQQLfuOBoefOT*aXST3Lzu6pGhGWy-j1ZcFpZeZ-JvTHt44l8DCAw8oDYtgVP5ME-dJq2cgXc2/search.png?xn_version=201210232201) no-repeat scroll 0 0 transparent;
height: 31px;
width: 90px;
}

<!--SEARCH BAR CUSTOMIZATION END -->

 

Live Example

Screenshot Example:

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

Join Ning Creators Network

Email me when people reply –

Replies

  • Nice and slick! I dig! :) Thanks!

  • Nice :)

  • sweet

  • NC for Hire

    Thanks guys...

  • NC for Hire

    Hi Hoao,

    There is another attachment. Please open that...copy and paste it directly. If it still doesn't work, let me know. 

  • NC for Hire

    Hi Joan,

    Where did you paste the code? Top of all codes inside Advanced CCS? Bottom of all codes inside Advanced CCS? Just change the place and see what happens. 

  • NC for Hire

    Thanks Joao. Glad it worked for you now. 

This reply was deleted.

Search the Creators Network

Latest Activity

keila replied to SAMUEL QUELES's discussion Chat Spot: não consigo visualizar outro membro. in Criadores Brasileiros - Brazilian Creators
"olá samuel, bem, eu já testei o Spot, porém realmente é ruim fazer nossos usuários obrigatoriamente…"
17 hours ago
Olga Susana Benavidez is now a member of Ning Creators Network
17 hours ago
keila is now a member of Criadores Brasileiros - Brazilian Creators
17 hours ago
The Builder :) replied to Crystal's discussion Bugs, Broken Links, and other Glitches on Creators 3.0
"Hi Kos.
Very thanks for your support. Now the site is ready al 100% funtional.
And the link for sup…"
17 hours ago
Kos replied to Crystal's discussion Bugs, Broken Links, and other Glitches on Creators 3.0
"Ning is still not monitoring the forums and I see no one else reporting problems.  My reply is ther…"
18 hours ago
The Builder :) replied to Crystal's discussion Bugs, Broken Links, and other Glitches on Creators 3.0
"problems again. Error 522 Connection timed out. This page is an example
and now to do ? Anyone else…"
19 hours ago
Kos replied to Monica Diaz's discussion Migrating to Ning 3.0 Status [Update #4]
"Yes if it was in the forum post, it transfers over.  They were working on bugs and they solved many…"
yesterday
Garfield Archivist replied to Garfield Archivist's discussion Network Creators Private Survey Results
"You haven't upset me. I find it amusing. And I am hoping most of all others reading this  find amus…"
yesterday
SweetPotato replied to Garfield Archivist's discussion Network Creators Private Survey Results
"I think you're taking yourself a little too seriously. I'm really not that bothered so if I've upse…"
yesterday
Garfield Archivist replied to Garfield Archivist's discussion Network Creators Private Survey Results
"This is just to comical not to comment on. One Ning for hire (me) does something and has another Ni…"
yesterday
SweetPotato replied to Garfield Archivist's discussion Network Creators Private Survey Results
"Someone pm it to me please :-)"
yesterday
Garfield Archivist replied to Garfield Archivist's discussion Network Creators Private Survey Results
"The survey results have been sent! A big Thank you to all who participated both on the survey and i…"
yesterday
Valerie replied to Monica Diaz's discussion Migrating to Ning 3.0 Status [Update #4]
"I'm late to the party and am still in Ning 2.0 so I have a few questions. Will videos that have bee…"
yesterday
Edie2k2 replied to Ning's discussion Introducing Activity Feed Improvements, Including Member Status Updates
"Beautiful!"
yesterday
Garfield Archivist replied to Ning's discussion Introducing Activity Feed Improvements, Including Member Status Updates
""
yesterday
Garfield Archivist replied to Ning's discussion Introducing Activity Feed Improvements, Including Member Status Updates
"Almost there. This post was posted at 2:12 but yes we are close to bringing out the cake. :-)"
yesterday
György Juhász replied to Ning's discussion Introducing Activity Feed Improvements, Including Member Status Updates
"Hey, today is the first birthday of this post.Yeeeah! :-)"
yesterday
soporte is now a member of Ning Powered Events
Tuesday
Garfield Archivist replied to Garfield Archivist's discussion Network Creators Private Survey Results
""
Tuesday
Anam replied to Ning's discussion Introducing Activity Feed Improvements, Including Member Status Updates
"There have been some changes in recent days. Number 1, admins and Network Creators are now getting…"
Tuesday
More…