Jump to content

Search the Community

Showing results for tags 'CSS'.

More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Found 251 results

  1. Hello, Shouldn't the image PL5 component be using the srcset/picture css directives to pick the correct size for an image? or it does already and I don't know how to use it? Thank you for any advice or enlightenment.
  2. Plugins Active and installed: Akismet Anti-Spam Coming Soon Page & Maintenance Mode by SeedProd Contact Form 7 Cookie Law Info DMS Professional Tools Enhanced Media Library Flamingo Google Analytics for WordPress by MonsterInsights Google XML Sitemap Jetpack by WordPress.com Legull Loginizer MailChimp for WordPress PageLines Updater Schema App Structured Data Sucuri Security - Auditing, Malware Scanner and Hardening Uber reCaptcha Yoast SEO Wordpress Version: 4.8.1 Pagelines Version: 2.2.4 Good Evening/Afternoon or Morning, I am running into a problem with CSS styling not applying inside of most browsers (Safari, Firefox) when I am logged in to wordpress, and all browsers that I have tested when I am logged off and the site has been made public (Chrome, Firefox and Safari). As a result, I have managed to identify the probable cause. It looks as though these browsers are refusing to render my sites compiled CSS file due to it being a HTTP URL rather than HTTPS. I have attempted to change this URL to HTTPS in my browser, however it brings back an ERROR: File not found page - https://www.shortfilmblog.com/wp-content/uploads/pagelines/compiled-css-core-1505847507.css What would you suggest in this regard? Would this be resolvable from your end? Happy to provide any further details required.
  3. I know this is not an easy problem. Maybe there is a easy solution. I have tryed to uses the existing solution, that I have found in the forum I changed the colours of my nav (simple nav) and the hover effect (a. hover). I really tryed to highlight the active/used link in the nav but I cant figure it out. I want it to be black when active. Any help would be appreciated. Thanks. http://www.marcborries.de nav link: "Sinn & Selbst"
  4. Chrome scroll anchoring - overflow-anchor

    Hi guys, every since Chrome introduce scroll anchoring (see chrome://flags) blog posts on my page start scroll automatically as soon as the user scrolls down a bit. It is super annoying and I don't know exactly what triggers the incompatibility with Chrome's latest feature that is supposed to improve usability. Since I don't know what causes it (Pagelines, or a Plugin), I would like to disable the feature using a CSS override that Google describes as follow: "Scroll anchoring aims to be the default mode of behavior when launched, so that users benefit from it even on legacy content. A CSS property overflow-anchor can disable scroll anchoring in part or all of a webpage (opt out), or exclude portions of the DOM from the anchor node selection algorithm. This property supports the following values when applied to an element E: overflow-anchor: auto (the default value) declares that the DOM subtree rooted at E is eligible to participate in the anchor node selection algorithm for any scrolling box created by E or an ancestor of E. overflow-anchor: none declares that the DOM subtree rooted at E is not eligible to participate in the anchor node selection algorithm for any scrolling box created by E or an ancestor of E." Do you guys happen to know how to use that property with the ROOT element so it applies to the whole page? Thanks Michael
  5. Hello, I'm basically a designer and understand a little on how to change CSS, etc., so please excuse my ignorance... I recently upgraded to the newest platform from the DMS and my old DMS theme no longer functions. I'm trying to replace the image slider that my Horizon Photography Theme (Nick Haskins) had created. The Impulse image slider seemed the closest to what I need, but there are problems. It seems the the Impulse section for sliding images defaults to the image width, no the height. I can change the Impulse stage height and width, but this does nothing to the internal content. For instance, if I change the height to 200 pixels, the image remains the full width and only shows a cropped section. I would like the ability to change the Impulse height, and have the image height fit space. I've put this custom CSS in, but again, this only controls the stage height of Impulse: .pl-sn-impulse .pl-impulse-cell .cell-wrap, .pl-impulse-container, .owl-stage-outer { width: 100%; } Any suggestions welcome. Thanks
  6. CSS not working

    Hello. I have just realized that CSS (Less plugin) , is not working..... I have disable all plugins (except PL CUSTOM LESS and PL5) , and ... it's not working ... It's not the first time. Usually I had trouble with a plugin name Autoptimize , but it's Desactivate now , all memory have been purge, and it's still not working! :-/ So it's not from this plugin. NB : When I am logged on my website, if i go on the black wordpress dashboard bar, go on the PL icon, clic on </> LESS/CSS => then the page suddenly apply the CSS .... But As soon that i reload the page, nothing. I think the problem is that the plugin LESS/CSS does not load properly (if I can say that with my simples words). I order to keep the site "good looking" I have temporally copy/paste all my LESS code in a plugin : Script n Styles that apply the LESS/CSS code... but it's not a solution for long time. Can someone help me ? Did I do something wrong ? Is it an update ? my website : https://www.wedding-photography-minneapolis.com
  7. TeamWork styling

    Hi. I can't seem to get the Teamwork section to accept custom css. I am trying to change the padding from 7em to 1em on the splash part I have tried .pl-sn-teamwork .pl-tw-splash { padding-top: 1em; padding-bottom: 1em; } This works in chrome inspect but when added to custom css nothing happens. I have also tried most of the classes I can see accoiated with this section but again nothng seems to happen. Any ideas?
  8. Change size of the builder

    Feel free to delete this post if its not helpful or its just plain wrong. I though it might be useful to share how I customize the size of the builder. (reduce my eyestrain ) 1 - install stylerbot extension in chrome (stylerbot keeps this css every time you access the url) 2- add this css to stylerbot for the site you are working on .CodeMirror { font-size: 14px; height: 600px; } .pl-workarea.pl-has-sidebar .pl-workarea-sidebar-container { right: 0px; width: 500px; } .pl-workarea.pl-has-sidebar .iframe-container { right: 500px ; } change sizes to suit. Cheers.
  9. Hello there, We have started experiencing a crippling issue within the last few days. It seems that ever since three days ago the CSS will not load for our pages outside of the DMS editor. Inside of the editor everything appears to be looking fine, but after publishing and viewing the page in a new browser our elements are all over the place, and in the console it appears that there is an error stating that the CSS did not get loaded. Looking through FTP, it seems that the two CSS files in the pagelines folder in wp-content are now missing. We did not access this folder or modify any files prior to this. What kind of problem could this be? We are totally halted on any work we can perform until this is solved, so any help would be greatly appreciated. An example of the phenomenon: http://datesafe2.21thirteenhost.com/category/ask-mike/ Best, Perry
  10. DMS css error

    I have a site http://www.hipandkneedoc.com DMS2. Everything has been working great until I suddenly get this error "/* LESS PARSE ERROR in your Custom CSS: parse error: failed at `` line: 1326 */" Problem is there are only 296 lines in the Custom CSS. I've tried deactivating all plugins and the error keeps showing up. Any clue anyone? Here's the CSS: body.display-boxed #site .boxed-wrap .pl-area.makestuffinsidefullwidth .pl-area-wrap > .pl-content { padding-left: 0px; padding-right: 0px; } body.display-full #site .pl-area.makestuffinsidefullwidth .pl-content { max-width: none; } body #site .pl-area.makestuffinsidefullwidth .pl-section .pl-section > .pl-section-pad { padding: 0px; } .pl-section-pad { padding: 0 0; } body .pl-area .pl-section .pl-section > .pl-section-pad { padding: 8px; margin-bottom: 0; } .deepsky { background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, #50b8eb), color-stop(50%, #50b8eb), color-stop(50%, #1d9dd3)); background: -webkit-linear-gradient(top, #50b8eb, #3c95c7); background: -moz-linear-gradient(top, #50b8eb, #3c95c7); background: -ms-linear-gradient(top, #50b8eb, #3c95c7); background: -o-linear-gradient(top, #50b8eb, #3c95c7); -webkit-box-shadow: inset 1px 1px 0 0 rgba(255, 255, 255, 0.1); -moz-box-shadow: inset 1px 1px 0 0 rgba(255, 255, 255, 0.1); box-shadow: inset 1px 1px 0 0 rgba(255, 255, 255, 0.1); } .phone a { color: #58a8da; font-size: 34px; font-family: swis721_btroman; margin-top:50px; } .phone { color: #58a8da; font-size: 34px; font-family: swis721_btroman; margin-top:50px; } p { font-size:19px; line-height: 32px; } h1 { font-size: 45px; padding-bottom: 0px; color: #0074c8; font-family: swiss921_btregular; } h4 { font-size: 23px; padding: 5px 22px 10px 11px; color: #892d00; margin-top: -16px; line-height: 35px; } h5 { font-size: 25px; padding: 5px 22px 0px 11px; color: #0074c8; margin-top: 6px; line-height: 35px; } h6 { margin: 1em 0; border-bottom: 3px solid #dddddd; font-size: 32px; } .mright { margin: 0px 24px 5px 0px; } .pull-left { float: left !important; } .img-thumbnail { display: inline-block; height: auto; max-width: 100%; padding: 4px; line-height: 1.428571429; background-color: #ffffff; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .img-responsive { display: block; height: auto; max-width: 100%; } .caroufredsel_wrapper { height:235px; } .pl-testimonials-container { background-color: #55b5e8; } .section-testimonials blockquote { padding: 0 0 13px; margin: 0 100px 0 100px; border: none; font-size: 34px; letter-spacing: -1px; line-height: 1.35em; margin: 0; color: #fff; } .section-testimonials blockquote p { margin: 0 100px 0 100px; } .submenubar iframe { margin: 11px 0px 5px; width: 100%; min-height: 280px; } .sl-copy { display:none; } .sl-links { text-align:center; } .sb-white { list-style-type: none; background-color: #fff; border: 1px solid gray; padding: 4px; } .gform_wrapper .top_label .gfield_label { margin: 10px 0 4px 0; font-weight: bold; display: -moz-inline-stack; display: inline-block; line-height: 1em; clear: both; font-size: medium; } .gform_wrapper .gfield_checkbox li label, .gform_wrapper .gfield_radio li label { display: block; margin: 0 0 0 24px; padding: 0; width: auto; line-height: 1em; vertical-align: top; font-size: medium; } .gform_wrapper { overflow: inherit; margin: 10px 0; max-width: 98%; background-color: #dce3ea; padding: 11px; } .gform_wrapper input[type=text], .gform_wrapper input[type=url], .gform_wrapper input[type=email], .gform_wrapper input[type=tel], .gform_wrapper input[type=number], .gform_wrapper input[type=password] { outline-style: none; font-size: 11px; font-family: inherit; padding: 5px 2px 5px 2px; letter-spacing: normal; max-height: 30px; } .formctrl { max-height: 35px; } .widget .widget-title, .widget .widgettitle { text-align: left; font-family: "Open Sans","Helvetica Neue","Helvetica",Arial,serif; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; font-size: 16px; line-height: 20px; margin-bottom: 5px; } li { color: #0074c8; } hr { margin-top: 10px; margin-bottom: 22px; border: 0; border-top: 3px solid #DDDDDD; } .tp-bannertimer { width: 100%; height: 10px; position: absolute; z-index: 1; top: 0px; display:none; } .fiximage { max-width: 100%; height: auto; margin-top: 45px; border-right: 24px solid #ececec; float: left !important; } /* MediaBox Link */ .section-mediabox { .pl-section-pad { .mediabox-wrap { .the-media { position: relative; margin: 0px; img { width: 517px; max-width: 100%; position: relative; z-index: 2000; } .the-media-html { position: absolute; display: inline-block; width: 100%; height: 100%; left: 0; top: 0; z-index: 2001; a { background: white; filter: alpha(opacity=0); opacity: 0; // fix IE background click issues cursor: pointer; } div, p, a { width: 100%; height: 100%; display: inline-block; } } } // end media } } } .mosaic-overlay .details .toggle p { padding: 0; margin: 5px 0; text-align: right; } .outbox { border: 5px solid #3fb6e9; } .pl-new-loop .hentry .metamedia { margin-bottom: 0; } .metahead { display:none; } .metabar { display:none; } <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <!-- MEET DR LABUTTI --> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-4656566801481743" data-ad-slot="3799098114" data-ad-format="auto"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script>
  11. Editing CSS via FTP/Server

    Hi, could you let me know where the custom less/css is saved to - i.e. how I could access it directly via the server. I hid the Admin Bar by mistake and now can't save any changes to the Custom CSS as the Save Button is not available - so I need to find another way to access and edit the custom CSS. Thanks in advance
  12. Hi, I'm trying to make improvements to 2 of our sites PageSpeed scores using W3 and Autoptimize, specifically Eliminate render-blocking JavaScript and CSS in above-the-fold content using Autoptimize. Both sites are running on Pagelines (2.2.4) but I'm having trouble locating the aggregated CSS stylesheet which should be at the top of the site header, but on these particular sites the source code look much different (http://imgur.com/a/0kqbc - Actual site we are improving) Whereas most of the sites we have improved in the past (inclduing the example demo site of the plugin) the source code looks like this; http://imgur.com/LjRy5K7 (Tutorial Site Example of Source Code with Aggregated CSS link) I've turned off all the plugins on both sites and at this point I am 99.9% sure the source code formatting has been 'altered' by pagelines. Does anybody know where/how i can locate the stylesheet I need? Thanks in advance.
  13. GRAMS - Margin controls?

    Hopefully a quick and easy question. How do I create margins in between the images in Grams? I'd like it to look like this: http://sortedtravel.com/memoirs Thanks, J.D.
  14. Custum height on section Impulse

    The new good looking Impulse slider — How can I change it to custom height?
  15. I worked on a DMS template/design on one of my websites while testing things out. After I got things like I really wanted, I performed the export function and downloaded my templates, files, configurations, etc.  I selected all options to export (Global Settings, Post Types, etc).   I then went into another website I have, installed DMS, activated (Developer account) and got the usual welcome, etc.etc.   I then went, uploaded my exported configurations and everything appeared to copy over after loading the main template I was wanting to see.  Some images aren't showing up but that's no biggie.   My problem is that I had about 8-10 blocks of custom css code I added to the original design and this does not show on the Custom Less/Css area so I went to just copy it over from the other site into the block area for Custom Less/CSS but the field is not active on the new site.  I can click on "Custom Scripts" and that is active and will allow me to add data but the Custom Less/CSS field is not "active" and I can't click inside or add anything.   Did I do something wrong?
  16. Just an FYI.  I was having issues with the CSS Less box and items disappearing or appearing very light gray and blocked out from me accessing.    Found out for sure that if you install or have the "Shortcodes Ultimate" plugin installed (version 3.9.5 is what I was using) or install it after starting a new site, it will cause the CSS Less box to crash. Started with this plugin when debugging and after deactivating and going back in, CSS Less was fine.   Hope this helps someone who may have experienced the same issue.   James
  17. We have been customizing sites with the old framework for about a year and loved it.  We could easily add hooks into the site (for example a line under the post title or a footer design at the bottom of the site) but now it seems we cannot do that without going through all the hoops of creating a child theme?    Please tell me I am missing something here.  We have been with pagelines for almost a year now and have used the custom CSS code plus the hooker plugin to make some awesome custom sites.  Now, it seems a lot more complicated?    I have read the docs on hooks a couple times and this just seems way more complicated than it used to be.  Are we getting hooker back for DMS?   And I cannot even attempt to create a child theme because the base theme is not available for download.     Please help!
  18. Buddypress CSS Issuue

    Hi,   I have installed Pagelines Framework 2.44 with Buddypress 1.8 at http://futurecrafting.com.   The CSS for all the Buddypress pages is broken. For example, the activity stream (http://futurecrafting.com/activity) is compressed to about 250px, instead of the full width 500px.   I tried using Firebug, but couldn't figure out how to fix this.   Please help.
  19. Came across a site for a client that they like and it has a really cool feature when first beginning to scroll where the page seems to "cover up" the first part before locking the nav bar in place and scrolling through to the rest of site.    Love the concept and looks like they are using Rev Sliders for other area and just adding one image to each but does anyone know how the above description was accomplished?   Pretty sick looking!   Site address is http://www.august.com/   James
  20. So why can't we have a list of the css codes that apply to each pagelines section to make the styling classes and custom css easier? For example:   Hero Section   .pl-hero-wrap .pl-hero h1 > Changes the style of the title of the hero section   iBox Section ....   What I've noticed is that every time someone asks a question about css and styling classes, the default answer is go to Chrome developer tools / firefox / etc. and find the css. I understand that for the more savvy people, that may be the easiest way. But for me (a newbie), that's only useful if you know what you're looking for (i.e.. that .pl-hero-wrap .pl-hero h1) equals  title areas of the Hero section. Eg. I'd like to change the colour of the icon-font in my ibox section, but for the life of me, I can't work out which are the right codes to use (I've been trying with Google Chrome).   Obviously, I am not a coder and am very ignorant around all this stuff. I can't help thinking that a list would be pretty useful. Thanks anyway.      
  21. Every single day people ask us how to speed up their sites. So here are the most common reasons why a site can be slow and some solutions.   Shared Hosting   Shared hosting speeds depend on many factors.   How many other people are you sharing with? Often this is the main contributing factor and using the this tool you can instantly see how many other sites are competing for the resources.   Networked files systems. Often shared hosts will use networked filesystems to get more and more customers onto their overloaded servers. This is great unless you have many small files to load ( think file based object/db cache ) and the webserver has to fetch every single one over the network!   Poorly configured. Sometimes hosts disable a lot of core PHP functionality to make it more secure. SuHosin if not configured properly can cause problems.   One of the worse things for slowing down the web server is the amount of HTTP requests on a page. Back in the old days it would be one html file and a few images, so maybe 5 requests per page. Things have changed dramatically now! Ive tested some sites reported slow on this forum and seen well over 100 HTTP requests on one page alone! Imagine there are 1000 other sites on that server all with 100 requests per page! Now do you see why shared hosting is kinda slow sometimes? ​So there are a couple of ways to squeeze some more speed out of that 2 bit outfit you are paying next to nothing a month for.   Caching. Im going to stick my neck out here and recommend wp-super-cache. Its been around for ages and just works! It will store your pages/posts etc as static files and serve them via .htaccess so PHP is not even loaded. Also has built in support for CDN Pull Zone.   CDN. A Content Distribution Network offloads all your small files ( css/js/images ) to many other servers around the world and they are served by the closest server to the end user thats viewing your page, this speeds up your page response time by a huge amount! ​Remember all those HTTP requests  I mentioned just now? There are a few CDN plugins about none of which I have the time to test so I wrote one myself, its attached to this post. I adds a menu to the PageLines admin area with a text area to add your pullzone. If you need a cheap CDN package I recommend MaxCDN.    Resources mentioned in this post.   WordPress Super Cache   Reverse IP lookup tool   MaxCDN
  22. Hiya,   I've tried several different ways to center the main navigation for our site, but it still prefers to be a left-handed wallflower.    I used the code from 'sexy snips' and some code found in the forum from a user who sought to do the same thing last year. I even tried a couple of plugins.    I have a large number of plug-ins on my site so I deactivated everything and then cleared the cache as per some forums I read earlier. Still no love.    Thoughts? Suggestions? Code for the custom code area? (also, I put the custom code in the CSS Rules section). To be clear I have no knowledge of CSS at all. When I have time I will attempt learn, but for now I'm relying on those far more clever than myself. lol   Please let me know.   Thanks!   Noob. (aka Mary)
  23. Hi. So I'm doing a minor amount of tinkering to get my website to look alright. I'm just adding minor amounts of CSS into the Typography section of the PageLines Theme. For some reason when I try to change the line height for my primary content #entry_content.p {line-height: normal} all of my formatting just breaks.    I just want to condense the line height so that there isn't so much weight space in my paragraphs. A little help would be awesome.
  24. Currently I'm using the customization plugin to style our new website. I chose it over the child theme method for various reasons. One customization is changing the color and general style of the static nav bar. I am aware of the Crackbar plugin. But decided I can do the css myself. So using Firebug I found the code to change the Nav Bar. I did tests and got the style I needed. Then I added the code to the style.css file in the customization plugin directory. When I refreshed my browser to look at changes they happened in Chrome/Safari Mac (Webkit) and not Firefox Mac/Win (Gecko). Upon doing some searches in the forums here I found another person complaining about the customization plugin not applying their CSS. I saw that someone suggested using the Custom Code form field in the Pagelines Global Settings.   Here's the code I used. You may notice that the classes say 'grey' but some hexidecimal colors are not grey but green. /*THIS CUSTOMIZES THE BACKGROUND COLORS, BORDER */ .navbar.pl-color-grey {     background-color: #80953a;     background-image: -moz-linear-gradient(top,#80953a,#80953a);     background-image: -ms-linear-gradient(top,#80953a,#80953a);     background-image: -webkit-gradient(linear,0 0,0 100%,from(#80953a),to(#80953a));     background-image: -webkit-linear-gradient(top,#80953a,#80953a);     background-image: -o-linear-gradient(top,#80953a,#80953a);     background-image: linear-gradient(top,#80953a,#80953a);     background-repeat: repeat-x;     filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80953a', endColorstr='#80953a', GradientType=0);     border-top: 1px solid #cbe82e;     color: #ffffff; } /*THIS CUSTOMIZES THE LIST ITEMS - THE FONTS */ .navbar.pl-color-grey .navline > li > a {     color: #FFFFFF;     text-shadow: #FFFFFF 0 0px 0; } .navbar.pl-color-grey .navline > li.current-menu-item > a {     color: #80953a;     background-color: #FFFFFF;     text-shadow: #FFFFFF 0 0px 0; } /*THIS CUSTOMIZES THE LIST ITEMS HOVER - THE FONTS */ .navbar.pl-color-grey .navline > li > a:hover {     color: #0E4EA2; } I took out the CSS to change the top nav bar from the customization plugin style.css and pasted it in the Custom Code form. THEN it works in Chrome and Firefox. Most oddly IE 8 Windows shows the new Nav Bar colors for a few seconds then reverts to the original NavBar colors I'm trying to override. Why did this work when just editing the style.css did not? Specifically with how Firefox handled it differently than Chrome. Can I use both methods of editing CSS at the same time without side affects? Thanks. -BrianR    
  25. The responsive mobile theme built into pagelines is excellent, but there's one thing I'm curious about.    I see that content-width, when viewed from a mobile device, is 100% of the width. And that's great. But many of my readers say that they can't zoom in on pictures. Is there any way to enable them to zoom when viewing from their phone? thanks!   if so, could you point me in the right direction as far as CSS selectors and/or anything else you might be familiar with?