By default, the top navigation menu is aligned left within the body of the page, which itself is centered and 1000 pixels wide. It looks like this normally: You can center that top nav menu, however, so it looks like this...
A common design choice is to uppercase all letters in the top navigation menu. You can easily do this on your site by adding this custom CSS to your theme: table.horizontalMenu { text-transform: uppercase; } To add this, go to...
If you would like to prevent anyone on you site from following members on your site, you can hide the "Follow User" links that appear on Member Profile pages and in the Member Snapshot by adding the following Custom CSS to your Display Settings....
The theme editor allows you to customize the overall background color for your widgets. Here's a typical widget styled using the the theme editor only: Change Title Font Properties If you just want to change the widget title's font size, color, or weight (how bold it is), apply CSS like this (setting your own specific colors, sizes, weights): header.widget-header h3 { color: #4d709f; font-weight:400; font-size:1.1rem; } Note that you should be using REM units for font size, not pixels. That...
By default, the main navigation menu is displayed ABOVE your site header. It is also full width by default, like so: Below, we will offer some tips for changing the appearance and positioning of your main nav menu. Left Align The Menu To position your menu text so it is aligned left instead, add this CSS: nav#top_nav_bar ul.right { float:left !important; } nav#top_nav_bar ul.right > li > ul.dropdown { left: 0; right: auto; } Your menu will then look like this: Center Align The Menu To...
Crowdstack displays breadcrumbs on all pages. However, for most sites, having a breadcrumb that simply says "Home" on the home page is superfluous. To remove the breadcrumbs on the home page only, add this CSS to your site:
On the Group Directory page, we don't style the list of groups much by default. Here's a typical group list: You can easily add more definition to this list by adding CSS to style the box for each group and also to change the way the group name is presented. For example, try adding this CSS: /* group directory improvements*/ .h-group-box { border:1px solid #dfdfdf; padding:10px; } .h-group-name h4 { text-transform:uppercase; font-weight:400; font-weight:1.1rem; } Your directory would look...
Just as you can use Font Awesome font icons for premium member badges, you can also use them for any permission circle badges, or activity level badges (instead of titles). For purposes of this tip, we will be creating a badge for Activity Level Titles, which can be set via Recipes. First, select the font icon you want from the FontAwesome list of icons, here . Note that while the Solid and Brands icons are free to use, Regular, Light, and Duotone require that you purchase a Pro license.
When you create a custom page and choose to insert it within the standard page wrapper, Crowdstack will automatically include the Page Name as the title at the top of the page. If you don't want the title to appear, insert this piece of custom CSS in your Custom Page, within the Custom CSS box: .h-home-menu-title-column { display:none; } NOTE this is updated since the April 2020 software release.
If you'd like to increase or decrease the size of the font used in the top navigation bar, insert this Custom CSS in your theme (this example increases the font size relative to the default size you've set): .top-bar-section ul li > a {font-size: 1.25rem;}
Thought I'd share a few of the CSS customizations we've made to our site which may be helpful to others, ...with the hope that a few of you would post your favorite customizations too. Please include your site's URL. (Would also welcome comments from Hoop if any of these need adjusting.) Our site: www.rotation.org /*hides # of views and bookmarks on a topic*/ .h-topic-metadata { display: none; } /*makes "Current Visitors" profile pics widget bigger*/...
If your number of members is small, and you'd rather hide the total (it automatically displays at the top of the Member Directory page), add this snippet to your Display Settings > Custom CSS: .member-count-container {display: none;} .h-member-count {display: none;}
When you block a person, they can no longer invite you to a private message or post to your profile wall. Replies and comments they make will be collapsed/hidden by default. Finally, you'll never receive email notifications about content they create or likes they designate for your content.
Note: if you proceed, you will no longer be following .