Salien theme resources
A collection of useful Salient theme examples, resources, tips & tricks to make your Salient website awesomeRemove slide count in Salient sliders next/prev arrows
If you want to remove the slide count in the Salient sliders next/prev arrows, you can add the following custom css into your custom css panel r into your Salient child themes style.css; .swiper-container .slider-prev, .swiper-container .slider-next { width:50px...
Sticky mobile menu for Salient theme
If you want to have a sticky mobile menu for Salient theme add the following css code to your custom css box or to your salient child theme style.css; @media only screen and (min-width : 1px) and (max-width : 1000px) { body #header-space { height: 56px!important;...
Hide Salient secondary menu on mobiles
Hide Salient secondary menu on mobiles and tablets using the following custom css in your options box or in your Salient child themes style.css; You can remove the secondary nav in ipad and mobile view using below custom css: @media only screen and (min-width : 1px)...
Removing Author, Date, Tags, and Comments on Salient theme Blog Titles
If you want to removing the Author, Date, Tags, and Comments on Salient theme Blog Titles add the following into your custom css box or to your Salient child theme style.css For the Blog page; body .meta-author {display: none !important;} body .meta-category {display:...
Create a landing page with Salient theme
Create a landing page with Salient theme by hiding the navigation and footer using custom CSS. Add this into the Custom CSS box located in your Salient Options panel or Salient child theme style.css. Change the page id to that of the page you want to hide the elements...
Change widget title colour in Salient themes
/*Change widget title colour in Salient themes*/ Add this CSS to your Salient Child theme or into your Salient theme options panel #sidebar h4 { color: #249cc1 !important; }
Add padding under header in Salient themes
/*Add padding under header in Salient themes*/ Add this CSS to your Salient Child theme or into your Salient theme options panel body[data-bg-header="true"] .container-wrap { padding-top: 25px!important; }
Hide portfolio arrows in Salient theme
/*Hide portfolio arrows in Salient theme*/ Add this CSS to your Salient Child theme or into your Salient theme options panel #portfolio-nav ul.controls { display: none; }
Remove search function in Salient theme
/*Remove search function in Salient theme*/ Add this CSS to your Salient Child theme or into your Salient theme options panel #mobile-menu #mobile-search, header#top nav ul #search-btn { display: none!important; }
Salient child theme
If you want to edit the style of the Salient theme beyond what is achievable in the theme options, then you will probably need to edit some CSS and possibly some php files. You can edit the CSS by using the custom CSS box in the general theme options and for a few...
Remove header and footer in Salient theme
/*Remove header and footer in Salient theme*/ Add this CSS to your Salient Child theme or into your Salient theme options panel .page-id-xxx #header-space , .page-id-645 #header-outer { display:none; } .page-id-xxx #footer-outer{ display:none; } .page-id-xxx...
Remove title and date from portfolio thumbnail in Salient theme
/*Remove title and date from portfolio thumbnail in Salient theme*/ Add this CSS to your Salient Child theme or into your Salient theme options panel /* hide title and date */ body .portfolio-items .col .work-info .vert-center { display: none; } /* hide title only */...
Change colours on Nectar slider headings in Salient theme
Add this CSS to your Salient Child theme or into your Salient theme options panel /*Change colours on Nectar slider headings in Salient theme*/ /* Heading for all slides*/ body .swiper-slide .content h2 { color: #ff0 !important; } /* Sub heading for all slides*/ body...
Change team member size in Salient theme
/*Change team member size in Salient theme*/ Add this CSS to your Salient Child theme or into your Salient theme options panel #ajax-content-wrap .team-member img { height: 206px; }
Remove sticky header in Salient theme
/*Remove sticky header in Salient theme*/ Add this CSS to your Salient Child theme, or into the Salient theme options panel. #header-outer, #header-space { position: absolute !important; }
Add a semi-transparent background on Nectar slider in Salient theme
/*Add a semi-transparent background on Nectar slider heading in Salient theme */ Add this CSS into your child theme CSS file or into your Salient theme options panel .swiper-slide .content h2 { padding: 4px 0px; display: inline; position: relative; left: 10px;...
Add button to menu/navigation in Salient theme
Add button to menu/navigation in Salient theme Add this custom CSS into your child theme or Salient theme options panel. body header#top nav > ul > li.menu-button a { box-shadow: 0 -1px rgba(0, 0, 0, 0.1) inset; -moz-box-shadow: 0 -1px rgba(0, 0, 0, 0.1) inset;...
Change logo size in Salient theme
/*Change logo size in Salient theme*/ Add this into the Custom CSS box located in your Salient theme Options panel /* Desktop greater then 1000px */ @media only screen and (min-width : 1000px) { body header#top #logo img { height: 50px!important; margin-top: -8px...
Remove the thin bottom border on a transparent header in Salient theme
/*Remove the thin bottom border on a transparent header in Salient theme*/ Add this into the Custom CSS box located in your Salient Options panel : body #header-outer[data-transparent-header="true"].transparent { border: none !important; }
Salient theme support
When I made my 1st website using the Salient Theme I had so many questions and with the help of the ThemeNectar Salient theme support, I managed to solve them all. You will need to be registered to view the support forum, but if you have any pre-sales questions you...