Search Results for 'Add BuddyPress Styles to a Theme'
-
AuthorSearch Results
-
September 7, 2012 at 5:30 pm #141217
In reply to: [Resolved] Allignment – BlackLight theme
tomelk31
MemberThanks for your reply. I added the code above to my stylesheet but it didn’t change anything.
September 7, 2012 at 7:10 am #141185@mercime
ParticipantB. CREATE a NEW BLANK FILE named sidebar-buddypress.php
Open up the blank sidebar-buddypress.php file and add the following within:
`jQuery(document).ready( function() {
if ( jQuery(‘div#blog-details’).length && !jQuery(‘div#blog-details’).hasClass(‘show’) )
jQuery(‘div#blog-details’).toggle();
jQuery( ‘input#signup_with_blog’ ).click( function() {
jQuery(‘div#blog-details’).fadeOut().toggle();
});
});`
Save file.
C. Upload header-buddypress.php and sidebar-buddypress.php to your theme folder in server wp-content/themes/strings/ in the same directory where your regular header.php and sidebar.php files are
D. Copy the style modifications for some BP elements https://codex.buddypress.org/theme-development/theme-dev-bp-template-pack-walkthrough-twenty-ten-bp-1-5/3/ and paste those at the bottom of your theme’s stylesheet, then adjust to taste.
September 6, 2012 at 7:57 pm #141163In reply to: [Resolved] Allignment – BlackLight theme
@mercime
Participant@tomelk31 looks like the easiest option is available where you only need to adjust the style instead of revising 16 BP template files by adding the following to your stylesheet:
`#content .padder {
float: left;
margin-top: 20px;
width: 600px;
}`
then copy over the style modifications for some BP elements https://codex.buddypress.org/theme-development/theme-dev-bp-template-pack-walkthrough-twenty-ten-bp-1-5/3/ and paste those at the bottom of your theme’s stylesheet after the `#content .padder` above, then adjust to taste.September 5, 2012 at 4:13 pm #141053In reply to: Need Help With Alignment
newbie2011
Participant@shawn38, The site was using a blog from wordpress and the theme was well liked and buddypress was just a test at first. It seemed to work out pretty well for what the site needs. I will keep this in mind for any other future buddypress projects. The !important seemed to work. Thanks.
@karmatosed, Thanks for your input and will be using that as well.
@mercime, Thanks but, the way I aligned it isn’t proper. I added styles to each element because when I use the .bpcontent div it was only fixing the Members Directory page. The rest of the pages ended up still being out of alignment. Your post makes sense and I should have noticed that but, I didn’t. Thanks for that one. The sidebar-buddypress,php is no longer in use or shouldn’t be. I am using or planning on using my themes sidebar.php. This made it much easier when making the theme compatible. I am going to go back and fix the css and see if my alignment issue works out a little easier.
Thanks for everyones input, I am sure I’ll be back.
September 4, 2012 at 7:16 pm #140986In reply to: [Resolved] Aligment problem on Pinboard theme
@mercime
ParticipantB. At the bottom of the same 16 files, replace:
`
`
with the following (except for registration/register.php):
``
with the following for registration/register.php:
`jQuery(document).ready( function() {
if ( jQuery(‘div#blog-details’).length && !jQuery(‘div#blog-details’).hasClass(‘show’) )
jQuery(‘div#blog-details’).toggle();
jQuery( ‘input#signup_with_blog’ ).click( function() {
jQuery(‘div#blog-details’).fadeOut().toggle();
});
});`
Save files.
C. Upload the 6 BP folders containing the 16 files you’ve just revised to your server wp-content/themes/pinterest/
D. Copy the style modifications made in BP Twenty Ten at https://codex.buddypress.org/theme-development/theme-dev-bp-template-pack-walkthrough-twenty-ten-bp-1-5/3/ and paste to your theme’s stylesheet. Adjust to taste.
September 4, 2012 at 11:11 am #140908@mercime
ParticipantB. At the bottom of the same 16 files, replace:
`
`
with the following (except for registration/register.php):
``
with the following for registration/register.php:
`jQuery(document).ready( function() {
if ( jQuery(‘div#blog-details’).length && !jQuery(‘div#blog-details’).hasClass(‘show’) )
jQuery(‘div#blog-details’).toggle();
jQuery( ‘input#signup_with_blog’ ).click( function() {
jQuery(‘div#blog-details’).fadeOut().toggle();
});
});`
Save files.
C. Upload the 6 BP folders containing the 16 files you’ve just revised to your server wp-content/themes/catch-box/
D. Copy the style modifications made in BP Twenty Ten at https://codex.buddypress.org/theme-development/theme-dev-bp-template-pack-walkthrough-twenty-ten-bp-1-5/3/ and paste to your theme’s stylesheet. Adjust to taste.
September 3, 2012 at 7:21 pm #140849In reply to: Need Help With Alignment
@mercime
Participant@newbie2011 first of all, congratulations on fixing alignment of your Members Directory page for Step 3 of the BP compatibility process

The difference between members directory page from the activity page was that the div surrounding the content for members directory was `
` which had paddings and margins in your stylesheet while the div surrounding the activity was `` which had no style associated with it at all.So either you change the div in all the remaining BP template files from `
` to `` or, just make the change in stylesheet
from
`.bpcontent {
margin: 0 0 10px;
padding: 10px;
}`
to
`#bpcontent,
.bpcontent {
margin: 0 0 10px;
padding: 10px;
}`Btw, initial scan of your theme shows that you have the option of creating on two files, header-buddypress.php and sidebar-buddypress.php, to make your theme compatible with BP instead of revising the 16 BP template files transferred to your theme folder in server. FYI.
August 28, 2012 at 6:15 pm #140452In reply to: [Resolved] HTML changes for Akita Theme
@mercime
Participant== the sidebars are showing up under the main content ==
Hmm, fixing alignment about should have resolved that. I’ll check your site in a moment.
== what is the relevance of the M Flora Peterson picture ==
Sorry about that
I was comparing the codes of both Akita and Alyeska https://buddypress.org/community/groups/installing-buddypress/forum/topic/customising-alyeska-theme-for-buddypress/ which had that image and forgot to delete it from code posted. I’ve deleted it above now.== page heading, members bar and second divider are also out of place ==
Did you add the styles from codex page I referred to above? That would have taken in the horizontal overflow of the item and sub navigation elements.
August 28, 2012 at 2:57 am #140406In reply to: [Resolved] HTML changes for Akita Theme
@mercime
ParticipantB. At the bottom of the same 16 files, replace:
`
`
with the following (except for registration/register.php):
`<?php
themeblvd_main_bottom();
themeblvd_main_end();
get_footer();`with the following for registration/register.php:
`jQuery(document).ready( function() {
if ( jQuery(‘div#blog-details’).length && !jQuery(‘div#blog-details’).hasClass(‘show’) )
jQuery(‘div#blog-details’).toggle();
jQuery( ‘input#signup_with_blog’ ).click( function() {
jQuery(‘div#blog-details’).fadeOut().toggle();
});
});<?php
themeblvd_main_bottom();
themeblvd_main_end();
get_footer();`Save files.
C. Upload the 6 BP folders containing the 16 files you’ve just revised to your server wp-content/themes/akita/
D. Go to the style modifications made in BP Twenty Ten for reference especially with removing the bullets and bringing in the extended width of the BP elements. https://codex.buddypress.org/theme-development/theme-dev-bp-template-pack-walkthrough-twenty-ten-bp-1-5/3/ and copy these over to your theme’s stylesheet and adjust as needed.
August 25, 2012 at 3:49 am #140178In reply to: Theme issue – Page alignment
@mercime
ParticipantB. COPY your theme’s sidebar.php file and Save As > sidebar-buddypress.php
Open up the blank sidebar-buddypress.php file and at the very TOP of the file above other code, add this:
`‘;
`Then at the very BOTTOM of the same file below all other code, add this:
``
Save file.
C. Upload header-buddypress.php and sidebar-buddypress.php to your theme folder in server wp-content/themes/snapwire/ in the same directory where your regular header.php and sidebar.php files are
D. Final note: Copy the style modifications for some BP elements https://codex.buddypress.org/theme-development/theme-dev-bp-template-pack-walkthrough-twenty-ten-bp-1-5/3/ and paste those at the bottom of your theme’s stylesheet, then adjust to taste.
August 22, 2012 at 9:33 pm #140017In reply to: Is buddypress overriding the template filter?
enderpal444
Participant@djpaul @boonebgorges Could you give this a quick look. I tried adding theme root and theme root uri but now it doesnt even load the stylesheet. So I have this in total to try and load my “MobileThemeBeta” for mobile browsers.
`add_filter( ‘template’, ‘my_mobile_template’, 99999, 1);
function my_mobile_template($template){
if(wp_is_mobile())
return ‘MobileThemeBeta’;
return $template;
}add_filter( ‘theme_root’, ‘theme_root’, 99999, 1 );
function theme_root( $root_path ) {
if (wp_is_mobile())
return ‘MobileThemeBeta’;
return $root_path;
}add_filter( ‘theme_root_uri’, ‘theme_root_uri’, 99999, 1 );
function theme_root_uri( $root_url ) {
if (wp_is_mobile())
return ‘MobileThemeBeta’;
return $root_url;
}add_filter( ‘stylesheet’, ‘my_mobile_stylesheet’, 999999, 1);
function my_mobile_stylesheet($stylesheet){
if(wp_is_mobile())
return ‘MobileThemeBeta’;
return $stylesheet;
}`August 22, 2012 at 5:15 pm #139996@mercime
ParticipantB. CREATE A BLANK sidebar-buddypress.php
Open up the blank sidebar-buddypress.php file and at the very TOP of the file, add this:
``
Save file.
C. Upload header-buddypress.php and sidebar-buddypress.php to your theme folder in server wp-content/themes/snapwire/ in the same directory where your regular header.php and sidebar.php files are
D. Final note: Copy the style modifications for some BP elements https://codex.buddypress.org/theme-development/theme-dev-bp-template-pack-walkthrough-twenty-ten-bp-1-5/3/ and paste those at the bottom of your theme’s stylesheet, then adjust to taste.
August 14, 2012 at 4:48 pm #139432In reply to: Hiding header search box other than specific page
@mercime
Participant@mairaj know that if user disables styles in browser, they will see the search form. But should you still want to proceed with your method, these two lines should do it via CSS
`/* Hide search form in ALL pages */
#search-form { display: none; }/* Then show search form on this page only (change page ID to your installation’s page ID) */
body.page-id-25 #search-form { display: block; }`
You might have to add some width or float after display block depending on how you’ve styled the child theme.August 13, 2012 at 9:50 pm #139320@mercime
ParticipantB. At the bottom of the same 16 files, replace:
`
`
with the following (except for registration/register.php):
``
with the following for registration/register.php:
`jQuery(document).ready( function() {
if ( jQuery(‘div#blog-details’).length && !jQuery(‘div#blog-details’).hasClass(‘show’) )
jQuery(‘div#blog-details’).toggle();
jQuery( ‘input#signup_with_blog’ ).click( function() {
jQuery(‘div#blog-details’).fadeOut().toggle();
});
});`
Save files.
C. Upload the 6 BP folders containing the 16 files you’ve just revised to your server wp-content/themes/wallow/
D. Copy the style modifications made in BP Twenty Ten at https://codex.buddypress.org/theme-development/theme-dev-bp-template-pack-walkthrough-twenty-ten-bp-1-5/3/ and paste to your theme’s stylesheet. Adjust to taste.
August 4, 2012 at 8:59 pm #138403In reply to: Alignment issues – CelebrityPress Theme
@mercime
Participant@blixus the styling is not coming from BuddyPress. Download Firebug, a Firefox add-on to identify the styles associated with the Avatar i.e., img.avatar in your stylesheet and make revisions as needed.
August 3, 2012 at 8:19 pm #138377In reply to: Alignment issues – CelebrityPress Theme
@mercime
ParticipantB. COPY your theme’s sidebar-single.php file (that’s the file called from your page.php file) and Save As > sidebar-buddypress.php
Open up the blank sidebar-buddypress.php file and at the very TOP of the file, above all code add this:
``
Save file.
C. Upload header-buddypress.php and sidebar-buddypress.php to your theme folder in server wp-content/themes/celebritypress/ in the same directory where your regular header.php and sidebar.php files are
D. Final note: Copy the style modifications for some BP elements https://codex.buddypress.org/theme-development/theme-dev-bp-template-pack-walkthrough-twenty-ten-bp-1-5/3/ and paste those at the bottom of your theme’s stylesheet, then adjust to taste.
August 1, 2012 at 7:19 am #138247@mercime
Participant@raminjan install the Firebug add-on for Firefox, right-click on the element you want to change, then add the changes to your stylesheet.
The current styles for the updated message
div#message.updated { clear: both; } div#message.updated p { background-color: #8FF57A; border-color: #80CF70; color: #1A6A00; } div#message p { background-color: #F4F4F4; border: 1px solid #DDDDDD; color: #555555; font-size: 14px; margin: 20px; }So use same selectors and change the property/value as you want it acoordingly in your theme’s stylesheet.
July 28, 2012 at 10:32 pm #138119In reply to: [Resolved] Buddypress and multisite admin bar gap?
@mercime
Participant@meisterlumpi it has been resolved, so no need to open a new ticket.
Instead of messing with core file, you could just add the change in your theme’s stylesheet. Also, the the change should have been for body.wp-admin only, since removing it from body could make the adminbar overlap your content at top if your theme design is set flush to top of screen.
July 28, 2012 at 6:53 pm #138109@mercime
ParticipantAdd this to your theme’s stylesheet:
`div#wpadminbar { position: absolute !important; }`
July 26, 2012 at 10:43 am #137978@mercime
Participant@idanny08 Based on the HTML structure of your theme, you will only need to create two new files, header-buddypress.php and sidebar-buddypress.php to make the BP templates compatible with your theme.
If you’ve revised any of the BP template files transferred to your wisdom of life theme folder in server during the BP Compatibility process, please delete the 6 BP folders transferred to your theme folder in server – /activity, /blogs, /forums, /members, /groups, /register – then re-run Appearance > BP Compatibility again to make sure that you have clean template files.
A. COPY your theme’s header.php and Save As > header-buddypress.php
Open up header-buddypress.php and at the BOTTOM of the file, below other code contained within, add the code from http://pastebin.com/pTiuAruq
Save file.
B. CREATE A NEW BLANK FILE named sidebar-buddypress.php
Open up the blank sidebar-buddypress.php file and add the code from http://pastebin.com/1FyKJ5eK
Save file.
C. Upload header-buddypress.php and sidebar-buddypress.php to your theme folder in server wp-content/themes/wisdom-of-life/ in the same directory where your regular header.php and sidebar.php files are
D. Copy the style modifications for some BP elements https://codex.buddypress.org/theme-development/theme-dev-bp-template-pack-walkthrough-twenty-ten-bp-1-5/3/ and paste those at the bottom of your theme’s stylesheet, then adjust to taste.
Final note: not sure whether the breadcrumbs or theme options will work in the BP pages.
July 23, 2012 at 4:10 am #137814@mercime
ParticipantGlad you resolved this on your own. For others, add “buddypress” without the quotes to tag in stylesheet.
`Tag: buddypress, etc. etc. etc.`
July 21, 2012 at 8:07 am #137719@mercime
Participant@timetraveler – add the following at the bottom of your stylesheet.
`ul#activity-stream div.activity-meta {
clear: left;
margin-bottom: 15px;
position: static;
}.activity-list li.mini .activity-content {
margin-right: 25px !important;
}`July 17, 2012 at 11:52 pm #137464@mercime
Participant== The button on the activity stream for “Joe Schmoe joined . . .” is obscured by buttons ==
@timetraveler As an online visitor, activity stream looks good for Joe joining a group. I will presume you mean the activity meta seen by logged-in users i.e., the Comment, Favorite and Delete buttons. If so, open up your theme’s stylesheet and add the following at the bottom.
`ul#activity-stream div.activity-meta {
clear: left;
margin-bottom: 15px;
}`If that doesn’t work, create a throw-away username and password and post it here. You can delete that account after the issue has been resolved.
July 12, 2012 at 3:22 am #137180In reply to: [Resolved] Compatibility with InStyle Theme
@mercime
ParticipantB. At the bottom of the same 16 files, replace:
`
`
with the following (except for registration/register.php):
`
<?php if (get_option('instyle_integration_single_bottom') ” && get_option(‘instyle_integrate_singlebottom_enable’) == ‘on’) echo(get_option(‘instyle_integration_single_bottom’)); ?>`
with the following for registration/register.php:
`
<?php if (get_option('instyle_integration_single_bottom') ” && get_option(‘instyle_integrate_singlebottom_enable’) == ‘on’) echo(get_option(‘instyle_integration_single_bottom’)); ?>jQuery(document).ready( function() {
if ( jQuery(‘div#blog-details’).length && !jQuery(‘div#blog-details’).hasClass(‘show’) )
jQuery(‘div#blog-details’).toggle();
jQuery( ‘input#signup_with_blog’ ).click( function() {
jQuery(‘div#blog-details’).fadeOut().toggle();
});
});`
Save files.
C. Upload the 6 BP folders containing the 16 files you’ve just revised to your server wp-content/themes/instyle/
D. Copy the style modifications made in BP Twenty Ten at https://codex.buddypress.org/theme-development/theme-dev-bp-template-pack-walkthrough-twenty-ten-bp-1-5/3/ and paste to your theme’s stylesheet. Adjust to taste.
July 11, 2012 at 5:36 am #137122@mercime
ParticipantB. At the bottom of the same 16 files, replace:
`
`
with the following (except for registration/register.php):
`<?php the_widget('WP_Widget_Text', 'title=Page Sidebar – Right&text=You could add some widgets in this area.', 'before_title=
&after_title=
‘); ?>
`
with the following for registration/register.php:
`<?php the_widget('WP_Widget_Text', 'title=Page Sidebar – Right&text=You could add some widgets in this area.', 'before_title=
&after_title=
‘); ?>
jQuery(document).ready( function() {
if ( jQuery(‘div#blog-details’).length && !jQuery(‘div#blog-details’).hasClass(‘show’) )
jQuery(‘div#blog-details’).toggle();
jQuery( ‘input#signup_with_blog’ ).click( function() {
jQuery(‘div#blog-details’).fadeOut().toggle();
});
});`
Save files.
C. Upload the 6 BP folders containing the 16 files you’ve just revised to your server wp-content/themes/collection/
D. Copy the style modifications made in BP Twenty Ten at https://codex.buddypress.org/theme-development/theme-dev-bp-template-pack-walkthrough-twenty-ten-bp-1-5/3/ and paste to your theme’s stylesheet. Adjust to taste.
-
AuthorSearch Results