Forum Replies Created
-
AuthorPosts
-
September 27, 2016 at 4:50 am in reply to: Sticky Sidebar Widget – Smart Passive Income Theme #193751rogerpParticipant
Yes, this is in the child theme -
jQuery(document).ready(function($) {
/**
* Configuration
* The container for your sidebar e.g. aside, #sidebar etc.
*/var sidebarElement = $('div#genesis-sidebar-primary');
// Check if the sidebar exists
if ($(sidebarElement).length > 0) {// Get the last widget in the sidebar, and its position on screen
var widgetDisplayed = false;
var lastWidget = $('.widget:last-child', $(sidebarElement));
var lastWidgetOffset = $(lastWidget).offset().top -100;// Hide the last widget
$(lastWidget).hide();// Check if user scroll have reached the top of the last widget and display it
$(document).scroll(function() {// If the widget has been displayed, we don't need to keep doing a check.
if (!widgetDisplayed) {
if($(this).scrollTop() > lastWidgetOffset) {
$(lastWidget).fadeIn('slow').addClass('wpbstickywidget');
widgetDisplayed = true;
}
}
});
}
});
Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the FutureSeptember 26, 2016 at 8:00 am in reply to: Sticky Sidebar Widget – Smart Passive Income Theme #193719rogerpParticipantGET http://www.rogerperkin.co.uk/wp-content/themes/smart-passive-income-pro/js/wpb-fadein-widget.js?ver=1.0.0
(index):275 WPP: OK. Execution time: 0.003449 secondsThis is all that shows?
Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the FutureSeptember 26, 2016 at 5:57 am in reply to: Sticky Sidebar Widget – Smart Passive Income Theme #193717rogerpParticipantThanks for your replies Brad,
Still no go - I have tried every option in the js file
var sidebarElement = $('div#genesis-sidebar-primary');
var sidebarElement = $('div#sidebar-primary');
var sidebarElement = $('div#.sidebar-primary');
var sidebarElement = $('div#primary');In the tutorial they are not using a . before?
The theory is the last widget will fade in and stick.
Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the FutureSeptember 26, 2016 at 4:07 am in reply to: Sticky Sidebar Widget – Smart Passive Income Theme #193711rogerpParticipant//* Enqueue Scripts and Styles
add_action( 'wp_enqueue_scripts', 'spi_enqueue_scripts_styles' );
function spi_enqueue_scripts_styles() {wp_enqueue_style( 'spi-fonts', '//fonts.googleapis.com/css?family=Roboto:300,400,400italic,700,900', array(), CHILD_THEME_VERSION );
wp_enqueue_style( 'dashicons' );wp_enqueue_script( 'spi-responsive-menu', get_stylesheet_directory_uri() . '/js/responsive-menu.js', array( 'jquery' ), '1.0.0', true );
$output = array(
'mainMenu' => __( 'Menu', 'smart-passive-income-pro' ),
'subMenu' => __( 'Menu', 'smart-passive-income-pro' ),
);
wp_localize_script( 'spi-responsive-menu', 'SPIL10n', $output );
wp_enqueue_script( 'stickywidget', get_template_directory_uri() . '/js/wpb-fadein-widget.js', array('jquery'), '1.0.0', true );
}Also checking that this is the right place to enque the javascript
Regards,
Roger
Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the FutureSeptember 26, 2016 at 4:02 am in reply to: Sticky Sidebar Widget – Smart Passive Income Theme #193709rogerpParticipantI have found this tutorial which seems to be exactly what I am looking for to make the last widget in the sidebar fade in and then stick
However I need to find the sidebar element for div tag
This is what I believe is the correct one div#genesis-sidebar-primary
However it is not working, so this was my first checkpoint to make sure the div id for the sidebar was correct
Thanks
Roger
Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the FuturerogerpParticipantFound it - in the CSS folder!
Had to do it with ftp
Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the FutureSeptember 23, 2016 at 5:38 am in reply to: Sticky Sidebar Widget – Smart Passive Income Theme #193580rogerpParticipantThanks Brad,
The Q2wd does what it says on the tin, but have to be careful about which widgets you stick as they just overwrite one below.
The one used on the Smart Passive Income Blog was immense but suspect this is custom code
http://web.archive.org/web/20160406064855/http://www.smartpassiveincome.com/blog/
It runs through the sidebar then when you get to the end throws in some custom content which sticks for the rest of the way down the page.
Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the FuturerogerpParticipantHi Cristoph,
Turns out the Genesis Tabs plugin was affecting this.
I don't need it for this theme so disabled it.
Roger
Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the FutureMay 10, 2016 at 4:26 am in reply to: How to create a Click Button that opens to an overlay popup form… #185342rogerpParticipantYou can also use AppSumo which is free to collect email addresses.
I have mine linked up to mailchimp and it works great
Check it here - http://www.rogerperkin.co.uk
Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the FuturerogerpParticipantFixed - I changed the slider settings and then uploaded different image sizes
Started again and all working
Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the FuturerogerpParticipantIt appears Genesis is changing my images?
I upload a 1140x445 image but the Slider is using this one
http://have-your-colours-done.co.uk/demo/wp-content/uploads/2016/03/featured-1-920x400.jpg
and renamed it to featured-1-920x400
What is doing this?
Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the FuturerogerpParticipantI have got there!
Here are all the changes I had to make
#273541 - Dark background
#3CA6FE - Light Blue highlight colourChanges to make News Pro Header Menu Colours different
** Make Header Bar Dark Blue **
Site Header
---------------------------------------------------------------------------------------------------- */
/* RP - Change header colour to dark blue */
.site-header {
background-color: #273541;** Make all Menu Items background default dark blue **
/* Primary Navigation
--------------------------------------------- */.nav-primary {
border-bottom: 1px solid #000;
border-top: 1px solid #e3e3e3;
background-color: #273541; <<<<<<<<<<<<<<<<<<<<<<<<
}
.nav-primary a {
color: #fff;
}/* Secondary Navigation
--------------------------------------------- */.nav-secondary {
border-bottom: 1px solid #e3e3e3;
background-color: #273541; <<<<<<<<<<<<<<<<<<<<<<<<<<
}** Current Menu Item **
.genesis-nav-menu a:hover,
.genesis-nav-menu .current-menu-item > a {
background-color: #3CA6FE;
color: #fff;
}** Make Menu Half Height and text White **
Site Navigation
---------------------------------------------------------------------------------------------------- */.genesis-nav-menu {
clear: both;
color: #fff;
font-size: 14px;
font-size: 1.4rem;
font-weight: 700;
line-height: 0;
width: 100%;You can see the new menu now at http://www.rogerperkin.co.uk
Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the FuturerogerpParticipantNow I would like to make the menu Bar half its height?
Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the FuturerogerpParticipantOk found the problem - US / UK spelling!
background-colour: #273541;
Should be
background-color: #273541;
Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the FuturerogerpParticipantI am making progress but cannot find the setting to make the default background for all menu items not be white
Thanks
Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the FuturerogerpParticipantThanks for the tutorial - I have made these changes
/* Primary Navigation
--------------------------------------------- */.nav-primary {
border-bottom: 1px solid #000;
border-top: 1px solid #e3e3e3;
background-colour: #273541;
}
.nav-primary a {
color: #3CA6FE;But nothing changed?
Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the FuturerogerpParticipantThanks Lynne,
That has fixed it!
Roger
Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the FuturerogerpParticipantThese are the changes I have made to CSS - but footer text does not want to change.
If I use Inspector it is pulling the values from Body
.footer-widgets .widget-title {
border: none;
color: #fff;
font-weight: 700;
padding: 0;
/* change footer text font size */
margin-bottom: 12px;
margin-bottom: 1.2rem;
text-align: left;I have managed to make the text in .site-footer text smaller but for some reason the footer text is not changing.
Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the FuturerogerpParticipantThanks Victor,
I have made a change there to 1.2rem with no change in the footer text size?
If I use CSS inspector it is telling me that the font size in the footer is being inherited from body
Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the FuturerogerpParticipantWhen the image is uploaded it is being resized and 740x400 is added onto the end of the filename?
Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the Future -
AuthorPosts