Kieran_SQ

[Kieran_SQ]

Not marked as solution

[Kieran_SQ]

Not marked as solution

[Kieran_SQ]

Hi,

You can add the below CSS to your KLEO Child theme’s style.css or to the Quick CSS area in Theme Options to remove the latest update on the individual user profile.

COPY CODE

.bp-user #latest-update {
    display: none !important;
}

Thanks,

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[Kieran_SQ]

Hi,

I have updated the CSS to the below. The space was coming from setting a max-width for the date drop downs, I have also set text areas in myself summary to full width

COPY CODE

.profile-edit .profile .twelve.columns { width: 50%; float: left; }
.profile-edit .profile .twelve.columns { width: 50%; float: left; }
.profile-edit .profile .myself-summary .twelve.columns { width: 100%; }
.profile-edit .profile .myself-summary .twelve.columns { width: 100%; }

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[Kieran_SQ]

Hi,

All of the remaining scripts cannot be altered as they’re not on your server

COPY CODE

https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800|Raleway:100,200,300,400,500,600,700,800,900|Droid+Serif:400,700|Roboto+Condensed:300
https://maps.google.com/maps/api/js?&language=en&key=AIzaSyDViFQaDBjSHAhlNAHUOnUeqIuVTiaoUGo
https://fonts.googleapis.com/css?family=Raleway:400%2C300%2C500
https://www.google-analytics.com/analytics.js
https://connect.facebook.net/en_US/sdk.js
https://www.facebook.com/impression.php/f2ba77b306f518/?api_key=190090068388950&lid=115&payload=%7B%22source%22%3A%22jssdk%22%7D

Looking at the list the only real optimization I can see that you can do is use one or two less fonts, currently you have three. Two is considered the maximum that should be loaded for performance.

Single URL is coming from the logo using http and not https. The easiest solution is to go to WP Admin > Media and delete your current logo, then go to Theme Options and upload your logo again now that your site is running https.

The method you’re using to defer JavaScript is not catching the following external files.

COPY CODE

https://cdn.ckeditor.com/4.5.3/standard/ckeditor.js (443.6KiB)
https://cdnjs.cloudflare.com/ajax/libs/gsap/1.11.2/TweenMax.min.js (85.9KiB)
https://maps.google.com/maps/api/js?&language=en&key=AIzaSyDViFQaDBjSHAhlNAHUOnUeqIuVTiaoUGo (69.9KiB)
https://staticxx.facebook.com/connect/xd_arbiter/r/Ms1VZf1Vg1J.js?version=42 (35.9KiB of inline JavaScript)

Either the the plugin is failing to find them for X reason or is purposely ignoring them for compatibility. Please reach out to the developer for assistance with this.

With regards to the Slider Revolution, I cannot find a fix for this after excluding the scripts for you. I will ask one of our developers to look into this for you. They’ll be in touch as soon as they can, Monday to Friday, East European Time.

Thanks,

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[Kieran_SQ]

Hi,

Thanks, please use the below CSS that targets only the profile edit form

COPY CODE

.profile-edit .profile .twelve.columns:nth-child(2) { width: 100% !important; }
.profile-edit .profile .twelve.columns:nth-child(3) { width: 100% !important; }
.profile-edit .profile .datebox-selects .custom.dropdown { max-width: 30%; margin-left: 3%; float:left !important;}
.profile-edit .profile .twelve.columns { width: 50%; float: left; clear: none !important; }
.profile-edit .profile .twelve.columns:first-child { width: 100%; }

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[Kieran_SQ]

Hi,

Please remove the CSS I sent you and replace with the below which adds a float:left;

COPY CODE

.registration .twelve.columns:nth-child(2) { width: 100% !important; }
.registration .twelve.columns:nth-child(3) { width: 100% !important; }
.registration .datebox-selects .custom.dropdown { max-width: 30%; margin-left: 3%; float:left !important;}
.registration .twelve.columns { width: 50%; float: left; clear: none !important; }
.registration .twelve.columns:first-child { width: 100%; }

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[Kieran_SQ]

Hi,

Please try the below CSS

COPY CODE

.registration .twelve.columns:nth-child(2) { width: 100% !important; }
.registration .twelve.columns:nth-child(3) { width: 100% !important; }
.registration .datebox-selects .custom.dropdown { max-width: 30%; margin-left: 3%; }
.registration .twelve.columns { width: 50%; float: left; clear: none !important; }
.registration .twelve.columns:first-child { width: 100%; }

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[Kieran_SQ]

Hi,

To change the color, background-color and border-color for the ‘Create my account’ button within the register modal please use the below CSS

COPY CODE

#register_form button#signup {
    background-color: #540b4a;
    border-color: #540b4a;
    color: #ffffff;
}

Adjust the # values to suit your needs and Ctrl+F5 to see the changes on the front-end

Kieran.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[Kieran_SQ]

Hi,

I can’t see where you have added the CSS so please try adding the class .form-footer before the CSS I gave to see if that makes a difference

COPY CODE

.form-footer .kleo_members_carousel a:not(.button), div#main a:not(.button):not(.elementor-button) {
color: #ffffff !important;
}

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[Kieran_SQ]

Hi,

You have a plugin installed called BP Better Messages that has changed the class for the profile nav item. I have added the below to your Theme Options > General Settings > Quick CSS and the changes are reflected on the front-end. Please clear you local cache to see the changes.

COPY CODE

li#bp_better_messages_tab-personal-li {
    display: none !important;
}

Thanks,

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[Kieran_SQ]

Not marked as solution

[Kieran_SQ]

Hi,

You can use the below CSS to add an ellipsis effect to the text.

COPY CODE

.search-item .search-body p {
    overflow: hidden;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
}

Note: This will clip after one line

More info: https://developer.mozilla.org/en-US/docs/Web/CSS/text-overflow

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[Kieran_SQ]

In the case please also use the below CSS

COPY CODE

.regulartab dd p {
    color: #841173;
}

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[Kieran_SQ]

Hi,

Not sure if I understood your question or not, the below CSS changes the color for links in this area – let me know if that is what you wanted.

COPY CODE

#profile .regulartab a {
    color: #841173;
}

Change the # value to suit and clear cache(s) to see changes.

Also, if possible, please take larger screenshots as it will help me to identify the section you’re referring to.

Thanks,

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[Kieran_SQ]

Not marked as solution

[Kieran_SQ]

Hi @emmanuel,

You can use the below CSS to override the background color of this element

COPY CODE

.form-footer {
    background-color: #1abc9c !important;
    background-image: unset !important;
}

You may wish to use the below CSS instead of the snippet above which sets the color for the border too

COPY CODE

.form-footer {
    border-left: 10px solid #1abc9c;
    border-bottom: 10px solid #1abc9c;
    border-right: 10px solid #1abc9c;
    background-color: #1abc9c !important;
    background-image: unset !important;
}

You can override the color of the arrows by using the below CSS

COPY CODE

.kleo_members_carousel a:not(.button), div#main a:not(.button):not(.elementor-button) {
    color: #ffffff !important;
}

In each case please adjust the color # value to suit your needs and purge your cache(s) to see the changes.

Thanks,

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[Kieran_SQ]

Hi,

Absolutely, the default content of the KLEO Child theme is as below

COPY CODE

/*
Theme Name:     Kleo Child
Theme URI:
Description:    Child theme for Kleo
Author:         SeventhQueen
Author URI:     http://seventhqueen.com
Template:       kleo
Tags:  one-column, two-columns, right-sidebar, fluid-layout, custom-menu, featured-images, post-formats, sticky-post, translation-ready
License: GNU General Public License
License URI: license.txt
*/

/*
* Please add your custom styles below
*/

Kieran.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[Kieran_SQ]

Not marked as solution

[Kieran_SQ]

Not marked as solution

[Kieran_SQ]

Hi,

If you wish to completely remove the nav bar from the profile please use the below CSS in your KLEO Child theme’s style.css by going to WP Admin > Appearance > Editor > KLEO Child > Style.css or into Theme Options > General Settings > Scroll to: ‘Quick CSS’

COPY CODE

.profile #buddypress #item-nav {
    display: none !important;
}

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[Kieran_SQ]

Not marked as solution

[Kieran_SQ]

Not marked as solution

[Kieran_SQ]

Hi,

As per Laura’s reply there is no content behind the mobile menu so you won’t be able to set it to transparent as is. You can however change the color by using the below CSS in your KLEO Child theme’s style.css by going to Appearance > Editor > KLEO Child > Style.css or Theme Options > General Settings > Scroll to: ‘Quick CSS’

COPY CODE

@media (max-width: 991px) {
.kleo-navbar-fixed.navbar-transparent #header {background-color: #000000;}
}

Change #000000 to your desired color and purge your website cache and mobile device cache to see the changes.

Thanks,

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[Kieran_SQ]

Not marked as solution

[Kieran_SQ]

Hi,

Please try the below CSS in your KLEO Child theme’s style.css, make sure to completely purge any caching and your front-end cache to see the changes.

COPY CODE

@media screen and (min-width: 800px) {

.sidebar.sidebar-main.col-sm-3.col-sm-pull-6.sidebar-3lr {
    width: 20% !important;
}
.template-page.col-sm-6.col-sm-push-3.tpl-3lr {
    width: 45% !important;
}
.sidebar.sidebar-extra.col-sm-3.sidebar-3lr {
    width: 35%;
}
.template-page.col-sm-push-3 {
    left: -moz-calc(20% - 1px);
    left: -webkit-calc(20% - 1px);
    left: -o-calc(20% - 1px);
    left: calc(20% - 1px);
}
.col-sm-pull-6 {
    right: 45%;
}

}

Thanks,

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[Kieran_SQ]

Hi,

You can add multiple different code snippets in that file. Just open the file, scroll to the bottom and add the code on a new line just before the line that states not to edit below this point.

You might also want to add a note before your code so you know in future what the code is doing. You can add a note like this

COPY CODE

// Description of what my code is doing here
YOUR CODE HERE

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[Kieran_SQ]

Not marked as solution

[Kieran_SQ]

Hi,

Please use the below CSS snippet to convert to 4 from 3 members per row.

COPY CODE

.members-dir-list .four, .row .four { width: 25%; } 
#members-list .four.columns:nth-child(3n+1) { clear: none !important; }
#members-list .four.columns:nth-child(4n+1) { clear: both !important; }

Thanks,

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[Kieran_SQ]

Absolutely, to override the CSS use the snippet below and adjust to suit your needs

COPY CODE

.members #search-members-form #members_search_submit {
    background-color: #721fc7;
    color: #ffffff;
}

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[Kieran_SQ]

Hi,

You can add the below CSS to change the size of the search form. If you change the value from 70% width then update the two margin values with remaining percentage. For example 60% width 20% margin-left 20% margin-right.

COPY CODE

.members form#search-members-form {
    width: 70%;
    margin-left: 15%;
    margin-right: 15%;
}

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[Kieran_SQ]

Not marked as solution

[Kieran_SQ]

Hi,

For the modal please use the below CSS to override the background image and set background and border colors

COPY CODE

.reveal-modal {
    background-image: none !important;
    background-color: #117864;
    border: solid 10px #1cd6b1;
}

Change the # values to suit your needs

For the deprecated search area please use the below CSS to remove the background image and set a background color

COPY CODE

#search-bar {
    background-image: none !important;
    background-color: #721fc7;
}

As always make sure to clear all of your caches to see the changes.

Kieran.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[Kieran_SQ]

Not marked as solution

[Kieran_SQ]

Hi,

Please add the below CSS to your SweetDate Child theme’s style.css and completely purge your website and local cache to see the changes

COPY CODE

.register #main aside.four.columns {
    display: none;
}
.register #main .eight {
    width: 100%;
}

Thanks,

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

Attachments:

You must be logged in to view attached files.

[Kieran_SQ]

Hi,

I just double checked your style.css from the front-end and I can see you have removed all of the CSS from there. I spotted that you have an opening comment that is not closed after the ‘Please add your custom CSS’ message – if this was there prior to removing the CSS then that would stop any CSS taking effect – try removing the comment

Currently

COPY CODE

/*
Theme Name:     Kleo Child
Theme URI:
Description:    Child theme for Kleo
Author:         SeventhQueen
Author URI:     http://seventhqueen.com
Template:       kleo
Tags:  one-column, two-columns, right-sidebar, fluid-layout, custom-menu, featured-images, post-formats, sticky-post, translation-ready
License: GNU General Public License
License URI: license.txt
*/

/*
* Please add your custom styles below
*/

/*

Replace with

COPY CODE

/*
Theme Name:     Kleo Child
Theme URI:
Description:    Child theme for Kleo
Author:         SeventhQueen
Author URI:     http://seventhqueen.com
Template:       kleo
Tags:  one-column, two-columns, right-sidebar, fluid-layout, custom-menu, featured-images, post-formats, sticky-post, translation-ready
License: GNU General Public License
License URI: license.txt
*/

/*
* Please add your custom styles below
*/

Also please update to KLEO 4.3.4 as there is a fix for the activity title bug that is present on your site https://archived.seventhqueen.com/kleo/article/changelog

All the best,

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[Kieran_SQ]

Hi,

Please try removing the CSS you have for styling this section and replace with the below CSS

COPY CODE

form#whats-new-form {
    border-style: solid;
    border-color: #82E0AA;
    border-width: 5px;
    padding: 10px 15px;
}

I added a little padding to the top/bottom (10px) and left/right (15px) as the border sat directly on the elements, if you do not wish to have the padding you can simply delete that line from the snippet above.

Thanks,

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

Attachments:

You must be logged in to view attached files.

[Kieran_SQ]

Not marked as solution

[Kieran_SQ]

Hi,

You can use the below CSS in your BuddyApp Child theme’s style.css to add styling for the current day.

COPY CODE

#wp-calendar td#today {
    width: 27px;
    height: 22px;
    line-height: 22px;
    background: #0091d4;
    color: #ffffff;
    border-radius: 100%;
}

Adjust the colors to suit your needs and any of the height/width/line-height if you have overwritten the default CSS for text in the sidebar. Clear your website cache and front-end cache (Ctrl+F5) to see the changes.

Thanks,

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[Kieran_SQ]

Hi,

Have you changed the size via CSS for user images? If so you may need to increase the size of the generated images too, you can add the below snippet to your bp-custom.php file located in /wp-content/plugins/ or you can try this in your SweetDate Child theme’s functions.php

COPY CODE

define ( 'BP_AVATAR_THUMB_WIDTH', 100 );
define ( 'BP_AVATAR_THUMB_HEIGHT', 100 );
define ( 'BP_AVATAR_FULL_WIDTH', 250 );
define ( 'BP_AVATAR_FULL_HEIGHT', 250 );

Try adjusting the values to suit your needs, make sure to clear your cache each time you update a value and then try uploading a new profile avatar each time to see if this works for you.

Thanks,

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[Author]

Posts