WordPress.org

Support

Support » Themes and Templates » Using the Graphene slider to display images not posts

Using the Graphene slider to display images not posts

  • Hi,

    I was wondering if there is a way to use the Graphene slider to display images from a directory rather than show the posts submitted to the blog.

    Which file would I need to edit to try and make this happen if possible?

    Thanks

Viewing 15 replies - 1 through 15 (of 32 total)
  • Hey Danpne, I’m new to it too but it looks like you can in two steps.
    1. Create a new category and call it “Featured” or “Slider” or whatever you want
    2. Create a new post for each image you want to use in the slider
    3. Leave the post blank except for the “featured image” in the bottom right corner. Add the image you want to use here. Make sure that the dimensions will work with your site set up.
    4. Change the settings in the theme in this way, appearance > graphine options > slider options and then change the “categories to display” to the category you created.

    Hope that works!

    When I try this, I have a big white stripe on the top of the slider… any idea how to get rid of that? I am a beginner at html at best and what I tried so far has not worked.

    Greetings,
    I too would like to use the slider for images only. I currently have created 3 post in “featured” category, I have set the featured images and resized the images.. everything looks good except i would like to remove the entire excerp section and the read more link…I just want pictures here. any tip/help on which file to edit and where to look would help greatly, perhaps a future update could include a new “slider display style” to allow only images..

    http://jupiterpalmbeachgdnsrotaryclub.org/site/

    thanx in advance!

    BuddhaPi,

    I would like know how you insert only images in the slider in this blog.

    (I dont speak English very well)

    Tks,

    Try adding this to custom css under appearance/ graphene options /custom css

    .block-button, .block-button:visited
    {display: none;}
    .slider-entry-wrap {display:none}

    I think this is how I did it.

    Great! (worked)
    You know if is possible insert a link in the image/slider?

    when you set the featured image, you casn add a “link URL” the default is the link to the full size image…just change that to wherever you want it to point.

    Is there anyway to have the just slider image link to the Post/Page?

    yes, see above answer

    credling

    @credling

    zlatoluna,

    I am new to Word Press too. I am however more familiar with CSS and HTML, I read about the issue you were having while looking for the solution to the problem others had in this thread. After following their fix here. I had your issue as well and so far that has not been answered in this post. I was forced to figure it out or keep looking. I chose the first option as I felt it would be quicker. Now is my chance to give back to someone for all the help I have received from others along the way. I hope it helps you or someone else with this issue.

    Teach a man to fish is my philosophy. First, if you want to change something on your WP Theme a solid understanding of CSS basics will go a long way in helping you reach your goal. Once you understand those you can begin. One issue that is presented in any WP theme is that the code is not all laid out in the same order. So to find the exact area you desire to change defers from theme to theme, they are all similar but not identical. So you need to use a program like Firebug. This can be downloaded as a browser Add-on. For Google Chrome visit the following link here. Download the Add-on. Then once it’s activated (click the little bug near the top right portion of your browser inline with the address bar), you can right click any area of a webpage and select the “inspect with firebug lite” option. This will pull up a source code inspector at the bottom of your browser. Here you can check the CSS/HTML code by selecting the CSS or HTML panes. Hopefully that will give you an idea of where it resides in the code. From there you will need to manually edit the code.

    For your issue, where the white band is at the top of the slider above the image, try the following fix. The reason it is there is because the slider div is padded. Go to the Appearances> Editor> CSS Style sheet and remove the padding from the following code.

    .slider_post {
    float: left;
    padding: 20px;
    position: relative;
    width: 890px;
    height: 200px;
    }

    This should remove all the excess white space around the image. Remember too that the height of the slider box vs the image size can impact the spacing around the picture as well, too small and your image may be cropped. Too large and you will see white at the bottom and possibly the right side. Adjust accordingly.

    Again hope this helps. If so post your success so others will know. Thx!

    Buddha Pi, thanks so much! That was exactly what I needed! I came back after giving up on the slider after something like two weeks of work and voila! it’s finally doing what I want it to!

    Credling – as it happens I already tried that before but it didn’t fix my problem.

    Trying to develop my site as a showcase for designers
    Would like to add listing and be paid automatically
    Advertisers could set up featured articles so need to keep a text section
    Using a plugin for a gallery at present as you can see

    If there is a template plus plugins or indeed if you have seen anything that will work would really appreciate it
    Fit 4
    http://www.welshhousedesign.com

    3. Leave the post blank except for the “featured image” in the bottom right corner. Add the image you want to use here. Make sure that the dimensions will work with your site set up.

    When I leave the posts content empty, I only see a blank, white field. Only if I put in at least one character and mark as “show whole post” I see the picture.

    .block-button, .block-button:visited
    {display: none;}
    .slider-entry-wrap {display:none}

    With this code I get the whole picture without the excerpt on the right side but the shown featured picture has a small part on the rigth side doubeling the pictures beginning from the left.

    Here you can see what I mean: http://med2.sion.dioezese-linz.at/

    Any idea for both problems would be very much appriciated!
    Thank you!

    I can help you with the second one which should eliminate the need for the first one, really. I had the same problem and it turned out the image was sized incorrectly. My blog is set on 960 width. The boarder of the slider is (I believe, but you should check in the code) 5px on each side, so the picture would have to 950 x whatever height you are using. Again, I don’t remember the exact boarder size but if you are lazy like me and don’t feel like digging in the code (or just don’t know where to look), just start with adding 10px to your picture and keep going, you are close, I would say maybe 20px from the right size.

    @zlatoluna: does your name meen “Golden Moon” in czech?

    Thx for your detailed info which helped me to clear the problem. When the main picture has 960 the featured picture in the slider has the correct width. So the featured gets it automatic size from the original one?

    Now I have to try for the smaller slider in the three colums on http://med.sion.dioezese-linz.at

    You are right! I am lazy! And being lazy I still search around in the code and would like so much to find the exact places where to adjust the css formation.

    Maybe somebody finds out why I have to have at least one letter in the text so that the posting is shown at all in the slider? That would be fine!

    Thx and all th ebest for the new Year!

Viewing 15 replies - 1 through 15 (of 32 total)
  • The topic ‘Using the Graphene slider to display images not posts’ is closed to new replies.
Skip to toolbar