Jump to content
Sign in to follow this  
bama

3 main problems

Recommended Posts

bama

It's me again. 1. How do i make all contents transparent, i want to upload my own designed background on the home site and another one on all other pages, but the content (960px (mine is 1000px) and the header have white backgrounds. How do i get them transparent? i uploaded a dark grey background to show you where the problem is. the bg affects only the sites not the content. 2. I want the twitter feed to be extended (not just 960px) how can i do that? i couldn't find a solution via firebug. I found a old thread about it in the forum, but the solution does not work. 3. I really need toggles for my website, platform comes without a shortcode or something like that, so i ended up buying a plugin called "styles with shortcodes" and i'm able to make toggles now, but it works not really well with the theme and they have to much space between each other (the toggles) take a look at my site). I could fix that with firebug but i don't know where i have to put the code in, since it is not working in the stylesheet.css or the custom code section. my site is here: http://tellingbeatzz.net

Share this post


Link to post
Share on other sites
Rob
Since Question 1 is dependent upon Question 2 - resizing the layout - let's address that first. Go to Dashboard > PlatformPro > Layout Editor You'll see a layout of your site under Configure Layout Dimensions with text in the various sections. Grab the left edge, watching the bottom line that says Global Content Width. Drag the left edge left until the number in Global Content Width is 1000. You may have to adjust your sidebar(s) accordingly. Do that by sliding it/them to the right/left. Save the settings Now your site will be set to 1000px wide. Back to Question 1. If you make all your content transparent and load an image all you will see will be the image. Everything will be invisible. Try this for your menu in Dashboard > PlatformPro > Custom Code (Custom CSS) #primary-nav ul li {background: none;} or #nav_row ul li a{background:transparent} Question 3. The answer is Custom Code/Custom CSS section.

Former PageLines Moderator, Food Expert and Raconteur

Share this post


Link to post
Share on other sites
bama
Thank you, but for some reason it did not work out, the content and header are still white. any solutions? I also need to know how i make the twitter feed extended..

Share this post


Link to post
Share on other sites
Rob
Please explain what you mean by "twitter feed extended". Do you mean the twitterbox set to be equal to the page layout? To achieve that, use this code: #twitterbar{position:absolute;top:0px;left:0px;} The transparency issue - try to use this: #primary-nav {background: transparent;} #branding {background: transparent;} Have you any customized code in your Custom CSS that is controlling the header?

Former PageLines Moderator, Food Expert and Raconteur

Share this post


Link to post
Share on other sites
bama
Thanks again, but it does not work. i made the navigation titiles black, here are all my codes: #primary-nav {background: transparent;} #branding {background: transparent;} .fullwidth #column-main .mcolumn-pad { padding-left: 0; padding-right: 0; } html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { border: 0 none; font-size: 13px; margin: 0; outline: 0 none; padding: 0; vertical-align: baseline; } #twitterbar .content .tbubble { background: url("../images/twitter-balloon.png") no-repeat scroll 0 12px transparent; font-style: normal; padding: 12px 25px; } .tcolor3, .lcolor3 a, .main_nav li a, .widget-title a, h3.widget-title a, #subnav_row li a, .metabar em, .metabar a, .tags, #commentform label, .form-allowed-tags code, .rss-date, #breadcrumb, .reply a, .post-nav a, .post-nav a:visited, .post-footer, .auxilary a, #buddypress-page .standard-form .admin-links a, #twitterbar .content .tbubble, .widget ul.twitter .twitter-item, .cform .emailreqtxt, .cform .reqtxt, #pagination .wp-pagenavi a, #pagination .wp-pagenavi .current, #pagination .wp-pagenavi .extend, .main_nav ul.sf-menu a, .sf-menu a:visited, #featurenav a, #feature-footer span.playpause { color: #000000; With extend twitter feed, i mean something like in this example http://themeforest.net/item/fringe-tech-premium-wordpress-theme/full_screen_preview/234196 The twitter feed background repeats and does not have a fixed width. Thanks for your time rangelone.

Share this post


Link to post
Share on other sites
Rob
I'm sorry my offered solutions didn't work. Perhaps one of the other Moderators can be of greater assistance.

Former PageLines Moderator, Food Expert and Raconteur

Share this post


Link to post
Share on other sites
Jenny
Have you uploaded the custom background image already to make it easier to debug? Right now your site is all white so I can't really provide any help since I don't know what to remove.

Jenny :: Web designer at Simple Mama (follow me at @simplemamacom)

Check out Share Me, a social sharing add-on for DMS that is super simple to set up.

Share this post


Link to post
Share on other sites
maguinn
There have been several instances in the custom css where I've had to use the !important tag to override certain settings. This has been really handy for header font sizes, transparent backgrounds, etc. In fact, almost every time I've used a transparent background I've had to include this. Hope this helps at least a little!

Share this post


Link to post
Share on other sites
bama
Hey guys, Thanks for the help so far, but i still have the same problems. I changed a few things, you can now few my site at http://tellingbeatzz.net/home and i also uploaded a red background, now you can hopefully see where the problem is. I want all parts of the site wich are white to be red- covered by the background! Since i changed a few things in my custom css, i guess it's better to post also my codes again: FONT SICES: div, span, applet, object, iframe, h1, h2, p, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { font-size: 13px; } CONTENT PADDING .fullwidth #column-main .mcolumn-pad { padding-left: 0; padding-right: 0; } TWITTER BAR FONT STYLE #twitterbar .content .tbubble { font-style: normal; padding: 12px 25px; } I USED THIS CODE TO MAKE THE NAVIGATION FONT BLACK .tcolor3, .lcolor3 a, .main_nav li a, .widget-title a, h3.widget-title a, #subnav_row li a, .metabar em, .metabar a, .tags, #commentform label, .form-allowed-tags code, .rss-date, #breadcrumb, .reply a, .post-nav a, .post-nav a:visited, .post-footer, .auxilary a, #buddypress-page .standard-form .admin-links a, #twitterbar .content .tbubble, .widget ul.twitter .twitter-item, .cform .emailreqtxt, .cform .reqtxt, #pagination .wp-pagenavi a, #pagination .wp-pagenavi .current, #pagination .wp-pagenavi .extend, .main_nav ul.sf-menu a, .sf-menu a:visited, #featurenav a, #feature-footer span.playpause { color: #000000; I really hope somebody can help me out today..

Share this post


Link to post
Share on other sites
catrina
This code should make the page canvas (the white part of the website) transparent: [code]#page-canvas {background: none;}[/code]

Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
catrina
Try this to see if the background color changes to black: [code]#site #page-canvas {background-color: #000;}[/code] If so, then change the #000 to transparent.

Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
bama
Thanks again, but this code does not change anything

Share this post


Link to post
Share on other sites
Jenny
Try these four separately (not used at the same time) from top to bottom to see if one of them works: [code].canvas #page-canvas { background-color: transparent; }[/code] [code]div#page-canvas { background-color: transparent; }[/code] [code]div#page div#page-canvas { background-color: transparent; }[/code] [code]div#site.fullwidth div#page div#page-canvas { background-color: transparent; }[/code] The first one worked for me using firebug but I know that you sometimes need the previous CSS to make it work.

Jenny :: Web designer at Simple Mama (follow me at @simplemamacom)

Check out Share Me, a social sharing add-on for DMS that is super simple to set up.

Share this post


Link to post
Share on other sites
bama
Thanks for your help, but it's still the same, no changes..

Share this post


Link to post
Share on other sites
catrina
Hm, have you tried adding this CSS to the base stylesheet in the child theme instead?

Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
bama
yes i also put some of the codes at the bottom of the styesheet.css. I don't know much about codes, so it's maybe not the right place? HELP!!!!

Share this post


Link to post
Share on other sites
catrina
Hm, can you try removing all of the custom CSS you already added (and save it somewhere else like Notepad or some kind of notepad application) and just place one of the CSS suggestions mentioned above?

Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
bama
Catrina you are the best! :) it works now!! and i was just about to give up... If we could get the twitter bar also fixed then i would be completely satisfied. edit: I figured out what the problem was, this code: .tcolor3, .lcolor3 a, .main_nav li a, .widget-title a, h3.widget-title a, #subnav_row li a, .metabar em, .metabar a, .tags, #commentform label, .form-allowed-tags code, .rss-date, #breadcrumb, .reply a, .post-nav a, .post-nav a:visited, .post-footer, .auxilary a, #buddypress-page .standard-form .admin-links a, #twitterbar .content .tbubble, .widget ul.twitter .twitter-item, .cform .emailreqtxt, .cform .reqtxt, #pagination .wp-pagenavi a, #pagination .wp-pagenavi .current, #pagination .wp-pagenavi .extend, .main_nav ul.sf-menu a, .sf-menu a:visited, #featurenav a, #feature-footer span.playpause { color: #000000; did not have a clip? -> { at the end...

Share this post


Link to post
Share on other sites
Jenny
For your twitter bar question, feel free to check the solution I posted for that here: http://www.pagelines.com/forum/discussion/comment/70165#Comment_70165

Jenny :: Web designer at Simple Mama (follow me at @simplemamacom)

Check out Share Me, a social sharing add-on for DMS that is super simple to set up.

Share this post


Link to post
Share on other sites
bama
Thanks but i don't think it's a good solution, it adds a vertical scroll bar to the page. Is there no way to make it like in the platform pro demonstration? http://www.pagelines.com/demos/platformpro/

Share this post


Link to post
Share on other sites
catrina
You might want to try adding this CSS to your Custom CSS: [code]#twitterbar .content .tbubble { background-attachment: scroll; background-clip: border-box; background-color: transparent; background-origin: padding-box; background-position: 0 12px; background-repeat: no-repeat; background-size: auto auto; padding-bottom: 12px; padding-left: 25px; padding-right: 25px; padding-top: 12px;}[/code]

Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

×