WordPress.org

Ready to get started?Download WordPress

Forums

Portfolio Slideshow
Can I change the "Prev" and "Next" links to images? (2 posts)

  1. kbishop
    Member
    Posted 1 year ago #

    I am also wondering if I can change the "Prev" and "Next" navigation links to images. I have arrow images I want to upload to show instead of it saying Prev and Next.

    The site I'm working on is under construction so a link to it wouldn't help.

    http://wordpress.org/extend/plugins/portfolio-slideshow/

  2. francishunger
    Member
    Posted 1 year ago #

    Hi kbishop,

    You can use the text-mode for the navigation, so that you see the words "next" and "previous" and fiddle around with CSS and use background in conjunction with text indent, eg. like this

    .sep {
    display: none; /* makes the separator invisble */
    }
    
    .slideshow-nav a.slideshow-prev {
    position: relative; /* relative positioning, so that left and top will work */
    z-index: 10;
    left: -30em; /* allows to reposition the next and prev navigation */
    top: 15em;
    height: 3.125em; /* height of the prev.png - equals 50px in this case*/
    width: 3.125em; /* width of the prev.png  - equals 50px in this case*/
    background-image: url('images/prev.png'); /* here we define the image that should be used. Replace images/prev.png with whatever path and image that you have. The image folder should be placed within the themes folder */
    background-repeat: no-repeat;
    background-position: center center;
    text-indent: -99em; /* this moves the word "previous" to the left, so we don't see it anymore, just the background graphic is visible */
    display: inline-block;
    }
    
    .slideshow-nav a.slideshow-next{
    position: relative;
    z-index: 11;
    right: -30em;
    top: 15em;
    height: 3.125em;
    width: 3.125em;
    background-image: url('images/next.png');
    background-repeat: no-repeat;
    background-position: center center;
    text-indent: -999em;
    display: inline-block;
    }

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic

Tags

No tags yet.