Ello there,
First of all thanks for any help, it's appreciated.
What I am trying to do is change my website's logo on scroll, but I am trying to accomplish this through my theme options, and I am not looking to use CSS to hide/show a class which uses the background property to display the logo.
Instead in my header.php I am echoing a function which renders the logo dependent on what "header option" a user has selected.
Here is the PHP I have which works on a switch inside my admin panel, so if a user selects "Yes" and they would like to change the logo when the header is sticky then they have an option to upload an extra logo (this all works fine without checking if that css class exists):
$site_logo_change_scroll_switch = notorious_options('site_logo_change_scroll_switch');
if ( $site_logo_change_scroll_switch == true && class_exists('scrolled-nt') ) {
$logo_url = notorious_options('site_logo_change_scroll', false, 'url');
}
return $logo_url;
This code is all working fine, except for checking if the CSS class "scrolled-nt" exists to only display this logo on scroll. I am using Jquery to append this class to my logo:
jQuery(window).scroll(function(){
var fromTopPx = 5;
var scrolledFromtop = jQuery(window).scrollTop();
if(scrolledFromtop > fromTopPx){
jQuery('.nt-logo').addClass('scrolled-nt');
}else{
jQuery('.nt-logo').removeClass('scrolled-nt');
}
});
I can see on my website, that when I scroll down the extra CSS class "scrolled-nt" is added onto my img src, but the logo is not showing at all after or before scroll, with checking if this CSS class exists (in my php above).
Any idea what I'm doing wrong here?
I hope I explained this properly, and maybe it is a simple fix, but I am fairly new to JS/PHP and quickly getting an addiction for it.
Any helps appreciated, thanks!
Related
I'm trying to add the "custom background" support for a theme I'm building, so that users can change it in Appearance > Customize > Colors. The button is showing up, and it's working, BUT the color is not displaying in the live preview.
When I inspect the iframe, WordPress is not adding the "custom-background" body tag, and it's not adding the CSS in the head section of the document.
After hours of digging around, I noticed that one of my php files used as a template file contains a function definition. If I check if the function exists, the live preview magically starts working. This works:
if ( ! function_exists( 'posted_on' ) ) {
function posted_on() {
// Stuff here
}
}
This, on the other hand, breaks the live preview:
function posted_on() {
// Stuff here
}
Does anybody have any idea why is this happening? Why is omitting the check for the function name breaking the customizer's live preview? I checked the page source code in an HTML validator and it does not have any errors.
Thanks
I am currently editting a wordpress theme and creating a navigation bar half way the page that sticks to the top of the screen once the user scrolls past a certain point. Ive done this before and it worked fine. I copied that exact code and changed the #divs and classes to the correct ones. This is the code i use:
$(window).scroll(function () {
console.log($(window).scrollTop())
if ($(window).scrollTop() > 10) {
$("#stickbar-steps").addClass("after-scroll-wrap");
}
if ($(window).scrollTop() < 9) {
$("#stickbar-steps").removeClass("after-scroll-wrap");
}
});
However it doesn't seem to add the class to the #div.When i manually add the class to the #div it works fine but it just wont load the script or wont attach the class. Usually when i reach that point in my previous working one, i could see it getting attached using inspect element, but im not seeing it in this one.
The wordpress theme has a seperate page in the admin section which allows me to paste in JS code. I've tried to add it there and i've tried to paste a copy among the other jquery files in the functions.php. But neither of them seems to work.
Any ideas where to look for? Theme uses jquery ver=1.12.4.
Thanks
How to add css to specific wordpress user to hide plugin fiction over front end? I installed the wp-about-author plugin but I need to set as hidden for admin user. So when the admin make any blog post then the wp-about-author wont be displayed. Unfortunately no feedback from the plugin developer. Thanks for any suggestions.
CSS way is not recommended since the user can check out actual DOM by view the source.
Instead, You can prevent from even showing up in the DOM Tree by modifying a plugin php file.
$level = get_the_author_meta('user_level');
if ($level == 10) {
return;
}
Add this line to wp-about-author.php on line #31.
This works, I tested.
Try to update plugin better then hack css :) You can add to wp-about-author.php on line #102 something like:
if (wp_admin()) $return_content = '';
I didn't check it, but might work for you.
I'm new to OpenCart and don't have any experience with PHP, so I have a question. I want to add the following JavaScript to hide the url bar on mobile browsers
// When ready...
window.addEventListener("load",function() {
// Set a timeout...
setTimeout(function(){
// Hide the address bar!
window.scrollTo(0, 1);
}, 0);
});
However, I can't find a way to insert this so this code will be executed on all pages in OpenCart. Where should I put this code?
save your script to a file, say 'catalog/view/javascript/myscript.js'
Then add
$this->document->addScript('catalog/view/javascript/myscript.js');
to the catalog/controller/common/header.php some place before this line:
$this->data['scripts'] = $this->document->getScripts();
You could also just place your script inline into catalog/view/theme/{theme name}/template/common/header.tpl using normal html markup.
Looking at the theme documentation, I believe you want to edit the following file:
catalog/view/theme/{your-theme}/template/common/header.tpl
These templates (header, footer, etc) should appear on all pages.
You don't need to go through this trouble especially if you don't have access to FTP. All you need to do is just go to admin panel > design > theme editor > and choose the respective parts to insert the codes. If is footer then just choose footer.twig.
After adding the codes, click Save and you will see the changes immediately. If add the codes directly to the file on FTP, it won't work.
Tried and tested on OpenCart 3
To add a script like that, just go to admin panel > design > theme editor > select "common" > footer and in the end of the file (after </html>) add the script.
If you want script to all your pages of the OC just add it before footer tag in footer.tpl or footer.twig
I want to display certain text in all my posts except if it's in this one category. How do I do that? Oh yea I almost forgot I want to include the title of the post in the text. So I think I need to use echo, cat='-5', and or something?? I don't know how to form it though. Thanks!
You could use the Wordpress function in_category(). When you use it inside the loop, it returns true if the current post is a member of the category you passed it.
<?php
if ( in_category('my-category'))
{
// don't output text
} else {
// do output text
}
?>
Do you require the text to be completely locked away, or just hidden from view? If you only need it hidden from view (but accessible to anyone who chooses to pry) then you may be able to do it very quickly using css.
If you have coded your theme - or are using someone else's - that adds helpful styles into the header, you may have a lot to work with already. For example, this is a body declaration generated by the Thematic theme:
<body class="wordpress y2011 m01 d31 h12 archive category category-orthopaedics">
Say you have a chunk of content to hide:
<div class="text_to_hide">This is what gets hidden.</div>
Then you declare the CSS as:
.category-orthopaedics .text_to_hide { display: none; }