WordPress.org

Forums

Using the Graphene slider to display images not posts (33 posts)

  1. danpne
    Member
    Posted 3 years ago #

    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

  2. rseaver06
    Member
    Posted 3 years ago #

    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!

  3. zlatoluna
    Member
    Posted 3 years ago #

    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.

  4. BuddhaPi
    Member
    Posted 3 years ago #

    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!

  5. sarando
    Member
    Posted 3 years ago #

    BuddhaPi,

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

    (I dont speak English very well)

    Tks,

  6. BuddhaPi
    Member
    Posted 3 years ago #

    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.

  7. sarando
    Member
    Posted 3 years ago #

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

  8. BuddhaPi
    Member
    Posted 3 years ago #

    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.

  9. Steve K
    Member
    Posted 3 years ago #

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

  10. BuddhaPi
    Member
    Posted 3 years ago #

    yes, see above answer

  11. credling
    Member
    Posted 3 years ago #

    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!

  12. zlatoluna
    Member
    Posted 3 years ago #

    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.

  13. fit4
    Member
    Posted 3 years ago #

    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

  14. Andreas
    Member
    Posted 3 years ago #

    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!

  15. zlatoluna
    Member
    Posted 3 years ago #

    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.

  16. Andreas
    Member
    Posted 3 years ago #

    @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!

  17. camarchi01
    Member
    Posted 3 years ago #

    I used this code to remove the excerpt from the graphene theme image slider. It didnt work. Does anyone have a different code?

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

  18. BuddhaPi
    Member
    Posted 3 years ago #

    try this:

    .slider-entry-wrap {display:none}

    This is what I have for images only in the slider, no excerp, no link..

    http://lloydsautorestorations.com/site

  19. camarchi01
    Member
    Posted 3 years ago #

    it worked. but I still have a link to the blog post. How do I get rid of the link? Also is it possible to add the images without them being on another page or blog post?

  20. BuddhaPi
    Member
    Posted 3 years ago #

    go into graphene options / slider option, set the drop down to featured.
    go to the post in question, make sure it is in the featured category ( make this if you don't have one)set the featured image to be what you want in the slider..that should do the trick.

    ::EDIT:: the featured image does not have to appear in the post, so just remove it from the actual post content.

  21. camarchi01
    Member
    Posted 3 years ago #

    I guess I am still confused. Sorry. I did what you said but there is still a link to the blank blog post. Go to archibaldfam.com to see what it does.

  22. BuddhaPi
    Member
    Posted 3 years ago #

    on the edit post page do you have the drop for sl;ider image set to "use global setting"? Been awhile since I've been in here, and I'm trying to rememebr if i had to edit one of the files..

  23. camarchi01
    Member
    Posted 3 years ago #

    Yea there is the option for these:
    global setting
    don't show image
    featured image
    first image in post
    custom url

    it was on global setting and I changed it to featured image and it didnt do anything.

  24. BuddhaPi
    Member
    Posted 3 years ago #

    without being able to look in the backend, the only other thing I can think of is, when yu set the featured image, make sure the "file URL" is set to none, in the media window.

  25. deifos
    Member
    Posted 3 years ago #

    how did you guys get this sorted out? I see that camarichi01 got it right where the pictures do not link to anything just like buddhaPi, how did you guys did it?

    Thanks!

  26. kjodle
    Member
    Posted 3 years ago #

    Check the official Graphene support forum for more information. Lots of people there have done this.

  27. BuddhaPi
    Member
    Posted 3 years ago #

    with the latest version try this..

    make a back up of style.css first!
    around line 871 fin d this code snopppet

    .slider_post .permalink-overlay {
    	display: block;
    	position: absolute;
    	left: 0;
    	top: 0;
    	width: 100%;
    	height: 100%;
    	z-index: 5;
    
    and change it to this:
    .slider_post .permalink-overlay {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 5;

    this may not be the proper way to kill the link, but it works with no ill effects

  28. camarchi01
    Member
    Posted 3 years ago #

    Deifos...I disabled the graphene slider and downloaded the easing slider plugin.
    go to http://www.easingslider.matthewruddy.com/ and it tells you how to install it or copy this

    <?php if (function_exists('easing_slider')){ easing_slider(); }; ?>
    into where you want it. I put it into the header.php. this is of course after you have installed the easing slider plugin and put pictures in it how you want it.

  29. deifos
    Member
    Posted 3 years ago #

    Thank you guys I ended up making a few changes to the header.php file and accomplished what I wanted. I guess that is how you learn ha!

    Cheers!

  30. pleasemrwizzard
    Member
    Posted 2 years ago #

    I am trying to use the home page slider for images. I created a category called "Slider" and created a post (put in title, content area blank and set feature image).

    Then I go to Graphene Options and set:
    show posts from categories
    Slider image = "Feature Image"
    Slider Display Style = "Full post content"
    Front page post categories = "Slider"

    I keep getting the error message:
    ERROR: You must have selected at least one category when you have "Show posts from categories" selected for the slider.

Topic Closed

This topic has been closed to new replies.

About this Topic