• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar
  • Skip to footer

The Cre8tive Diva - WordPress Developer

Digital Nomad | Helping WordPress & Genesis Framework Website Owners All Over the World

  • Home
  • About
    • Accessibility Statement
    • Terms of Service & Privacy
  • Services
    • Blogger to WordPress Migration
    • Buddypress Installation
  • My Work
  • Blog
    • Tutorials
    • Five on Friday
    • Genesis Framework
    • Tipsy Tuesday
    • WordPress
  • Contact
Home » How to Float the Soliloquy Lite Responsive Slider Pager Buttons Vertically

How to Float the Soliloquy Lite Responsive Slider Pager Buttons Vertically

Recently I have been contacted quite a bit asking how to float the Soliloquy Lite Responsive Slider Pager Buttons Vertically on the right. I decided to write this post and record a video to share with everyone. Watch the video or follow the instructions below.

If you are unfamiliar with working with your theme files, stop and ask for help. If you are familiar with modifying your theme files – you should back them up before proceeding.

Step 1

Open up your stylesheet. Locate your Media Queries section or Responsive Design section. You will want to paste your code right above this area. If you cannot find one of these areas in your stylesheet, scroll all the way to the bottom, hit the return key a couple of times to start a new line and this is where you should paste your code.

Step 2

Click “View Raw” on the Gist below. Select all, copy and paste the code in the stylesheet position you located above. Then save it.

That’s it.

https://gist.github.com/cre8tivediva/c5ff4b05bc5768fbfabe2d780f99d2df

**Note: Depending on how many images you have in your slider, you may or may not need to adjust the percentage on Line 25. On a recent project, I have 7 images which resulted in having a larger space between the last button and the bottom of the image. The pager buttons were no longer centered vertically. Changing 50% to 40% fixed this problem and the buttons were then centered.

If you have any caching plugins installed, clear or delete your cache first. Then visit the front of the site and refresh your screen. You should see the pager buttons floating off to the right vertically.

I hope you find this useful.

  • Like my Signature? Get the Signature Widget for Genesis right here!

  • FacebookTweetPinPrintShares37

    Filed Under: Genesis Framework, Genesis Plugins, Tutorials Tagged With: adorn child theme, dainty child theme, darling child theme, faithful child theme, genesis, market child theme, novelty child theme, pager buttons, soliloquy, web savvy child themes

    Primary Sidebar

    It's just me and my dog Bella. I am a freelance web developer at Cre8tiveDiva.com. I build websites using WordPress and the Genesis Framework, WooCommerce and provide troubleshooting and support. I also build with Shopify. I love chocolate, lots of coffee!

    Sign Me Up!

    Receive my blog posts, tips and updates delivered to your inbox!

    Yes, Sign Me Up

    *By signing up you will receive new blogs, updates on products, services and important alerts.

    Categories

    • Design
    • eCommerce
    • Five on Friday
    • Fonts
    • Free Themes
    • Freebie Friday
    • Genesis Framework
    • Genesis Plugins
    • Genesis Themes
    • Genesis Untapped
    • Instagram
    • MailChimp
    • News
    • Plugins
    • Press This News
    • Social Media
    • Tipsy Tuesday
    • Troubleshooting
    • Tutorials
    • Uncategorized
    • Web Development
    • WooCommerce
    • WordPress
    • WordPress Plugins

    Footer

    Digital Nomad! I can be anywhere I wanna be now.

    Latest Blog Posts

    • Temporary Fix When Using Genesis Blocks Posts and Page Grid with Genesis Simple Share
    • How to Add Reading Time to a WordPress Genesis Child Theme Without a Plugin
    • How to Add “Shop” to WooCommerce Breadcrumbs when Using Yoast

    Looking for Something?

    Copyright © 2012–2023 · Designed with by Me! · Hosted on SiteGround