Jump to content

Archived

This topic is now archived and is closed to further replies.

caspersjan

Filtering Section - Featured images not showing

Recommended Posts

caspersjan    13
caspersjan

Hello, I am putting together my first DMS site, replicating one I'd built with Framework. Most things work well, some new features are brilliant! Thank you for porting the Filtering section to DMS - with its grace and filtering functionality it is always a delight and I couldn't do without it! It seems to work well, but for some reason does not display the posts' featured images - or any images at all (I tried to add an alternative default in the "Extra Image Options" and removed the featured images, without luck).

 

Unfortunately the site is on localhost as I am just learning to work with DMS, so I cannot post a link that may show you the code. But could there have been something obvious I may have overlooked? Have you come across this before, or is it just me? I can't find any settings that would need to be switched on for the featured image (of course I have "Show Image On Top" selected). And I'd be grateful for a tip.

 

Yours faithfully, Jan.

 

 

Share this post


Link to post
Share on other sites
ellenmva    112
ellenmva
Hi Jan,

It is hard to debug without seeing your screen. Does Filtering work otherwise, you have the filtering terms and then the posts? Is it just the images not displaying?

Also, it is the Filtering Plugin you have installed, not the section from the old Framework?

Lastly, can you open Chrome Developer Tools -> Console and see if there are any errors. If so take a screenshot so I can see.

Thanks. Ellen

Ellen Moore

Pagelines Developer

www.elsue.com www.betterdms.com

Share this post


Link to post
Share on other sites
caspersjan    13
caspersjan

Dear Sue, thank you for getting back to me. I believe it is the Filtering Plugin that I have installed and it is working fine otherwise, segueing away nicely through the categories. But your swift reply has encouraged me to put DMS on a live site. This I will do in the next days, if the missing-image-problem persists I'll report back. In the meantime good luck in your work and once again thank you for writing Filtering in the first place. I always loved Isotope but in the entire vast Wordpress plugin repository it seems to be like an eagle's feather... Yours faithfully, Jan.

  • Like 1

Share this post


Link to post
Share on other sites
Jenny    33
Jenny

Please let us know if you still need help with this topic otherwise I will close it in 7 days. Thanks!


Jenny :: Web designer at Simple Mama (follow me at @simplemamacom)

Check out Share Me, a social sharing add-on for DMS that is super simple to set up.

Share this post


Link to post
Share on other sites
caspersjan    13
caspersjan

Dear Ellen, dear Jenny, I just set up DMS on a live site and will install Filtering tonight to see if this problem persists. Thank you for your patience! Yours faithfully, Jan.

Share this post


Link to post
Share on other sites
caspersjan    13
caspersjan

Dear Ellen,

 

I beg your pardon for addressing you as Sue. I even think of having read about someone else doing so in another Forum post a while back. The confusion must come from your website, perhaps because it sounds like one name and the Sue part there is in italics, although you give your full name everywhere. My apologies!

 

Thank you for your patience - I put DMS on a live site, installed Filtering and hey presto, it works a treat. Featured images and all. On my offline trial site I installed and uninstalled and installed again and could not get them - now there they are. What is more, I managed to find the CSS selectors and address these images, changing their border radius, with this code in the DMS Custom LESS/CSS menu:

 

.section-filtering .filtering .filtering-image img {

border-radius: 500px;
}
 
Wonderful - what a delight! I can see great things coming now! It is easily the most visually satisfying section of them all!
 
One thing I didn't manage was to address the Title/Excerpt - I could not find any CSS selectors that would work there (to make the excerpt centred or justified, for example). Or could this be achieved in the new "Standard Options - Styling Classes" panel in the Filtering backend? I couldn't work out what that does. But I'll not give up and continue learning. I am also trying to put a button in the excerpt field (for access to a modal with information). But I'll hack away at that for a while and will ask for your counsel only if I can't figure it out at all.
 
In the meantime, thanks for your labours and the care you give to those who enjoy their fruits. And my regards to your co-coder Susan. Now the names are clear in my mind even though I am thousands of miles away from you! Greetings from the Holy Land, yours faithfully Jan.

Share this post


Link to post
Share on other sites
caspersjan    13
caspersjan

P.S.: It is like real life, sharing your worries with someone goes a long way to work them out... I found the selectors, now I am CSS master of my visual destiny! And I can have a go at finding a way to get a button into the excerpt, perhaps a harder task but one to be approached with good cheer now that I have worked out something, and know of your support! Again, thank you! yours faithfully, Jan.

Share this post


Link to post
Share on other sites
caspersjan    13
caspersjan

Dear Ellen, thank you for your kind words. It's only just the beginning! I think working with people who have to be inspiring in their everyday encounters helps, it certainly spurs me on in my efforts!

 

While I am practically talking to you I hope you don't mind if I ask something else: I am working on another page which introduces the librarians who take part in this programme, about forty five in total. With name and library (post title and excerpt) - displayed alphabetically by name and searchable by library. All very easy to do, and it would be beautiful! But in my mind's eye (unfettered as that is by practical constrictions) there is a button under the excerpt which I can click to access a link, ideally a modal with more info on the particular librarian, a little portfolio of their work etc.  I have done considerable reading over the past days (of the searching-for-a-pin-in-the-haystack kind, as I am no expert and don't know exactly what to look for) and it seems that this is difficult. I certainly have not found a straight forward tutorial that would show me what to do. 

 

You know your own handiwork inside out of course and must have come across all manner of implementations. Has anything like this ever been done? And do you think it could be done? Maybe it's impossible and I am just chasing a dream, and should look for another solution altogether. All I need is a nod of the head, or perhaps a pointer in some direction or other, so I know where best to invest my energies.

 

Thank you as ever for your work and support. Yours faithfully, Jan.

Share this post


Link to post
Share on other sites
caspersjan    13
caspersjan

Dear Ellen, an update: I have been waiting for betterdms.com to go live. It did today, and I see that you are part of the crew! Fair winds and following seas for your voyage - I shall await the exotic wares and stories you bring home from the distant shores of DMS coding with great anticipation. One of the first posts was by Nick Haskins, about "Infinite Loading". I had little idea what that meant and thought at first it was about infinite scrolling. But it is not - it's about the seamless opening up of posts with a press of a "More..." link. This might be the light I have sought at the end of the tunnel in question. I will try today if it works with your Filtering section. If I add a button to return me to the Filtering page, I may be home and dry before I know it!

I'll let you know of my progress. Yours faithfully, Jan.

Share this post


Link to post
Share on other sites
caspersjan    13
caspersjan

Dear Ellen, rolling news: I installed Nick's Load Posts plugin, shortened the excerpt and added "More..." caption within the editing panel of Filtering and it works nicely so far. Promising progress! I am still struggling with setting up some kind of button or link on the actual post page, but that's because I have not understood how posts are styled in DMS. As yet, as yet! I am sure I will in due time. So, for now I should not need to take up more of your time (unless you knew an easy way of making the "More..." link into a button, that is... 

Yours faithfully, Jan.

Share this post


Link to post
Share on other sites
ellenmva    112
ellenmva

Hi Jan,

 

We can make the More a button by adding a class to it. We are going to do that in the DMS Toolbar --> Custom Code --> Custom Scripts by adding this code:

<script>
jQuery(document).ready(function(){
			
   jQuery('.section-filtering .item-excerpt a').addClass('btn');		
});		
</script>

That is also going to put the ... in the button though too. I need to add a class to the More phrase so that doesn't happen. But first, let me know if that code worked in the Custom Scripts box.

 

Ellen


Ellen Moore

Pagelines Developer

www.elsue.com www.betterdms.com

Share this post


Link to post
Share on other sites
caspersjan    13
caspersjan

Dear Ellen, 

you are a star! I am dizzy with so much goodwill and learning in one day! Studying CSS selectors and styles this afternoon I finally managed to put a line break into the post titles, something that had eluded me for months. That way I will be able to have the first name on one line and the family name on the second, so that long and short names don't disturb the symmetry... And now your code, entered in the DMS "Custom Scripts" editor, indeed created a class and subsequently a button. After I gathered that 'btn' stood for 'button' and the class selector would be .btn - common fare for you of course but veritable magic for me! - I was able to add styling with my newly acquired CSS confidence. Here is my oeuvre, in all its raw beauty:

 

.section-filtering .btn  {
background: green;
-moz-border-radius: 20px;
border-radius: 20px;
color: white;
word-spacing: 0px;
width: 125px;
height: 25px;
display: inline-block;
padding: 4px 10px 4px;
margin-bottom: 0;
font-size: 14px;
line-height: 20.7px;
}
 
Quite a lot of styling, but my previous tampering with "word-spacing" to achieve the line breaks in three of the items made it necessary to be specific so that all buttons would look the same. I gleaned the correct style values with the help of the inspector tool. Who says old dogs can't be taught new tricks?
I lost the hover effect though, it is there in your original button but must presumably be overruled by my styling. But I shall look into that and do some reading. It seems 95% of CSS tutorials are about some form of styling buttons, I am bound to find something. 
The ... is still there indeed. I did not quite understand how the adding of the class worked, or I would have tried myself to remove it. If you could point out the right way for me I'd be most grateful. But all in all, I am already elated! It feels as if I have just learned to ride the bicycle...
 
Thank you so much I shall have to make an Oscars-style addendum somewhere on the site to thank all the wonderful people who gave so freely of their time and wisdom.
 
Yours faithfully, Jan.

Share this post


Link to post
Share on other sites
caspersjan    13
caspersjan

Dear Ellen, I am slowly making rapid progress. And growing to like Filtering even more in the process! CSS is a miracle, I have just scratched the surface but it is so powerful. You can see my current draft here, a directory of librarians, filtered by districts:

http://www.schuleverrueckt.de/wordpress/?page_id=250

Two selectors however have alluded me:

Firstly, whatever I try, I cannot manipulate the font size of the post title. I would have thought it should be .section-filtering .filtering .item .item-title but although the behaviour of elements below (the excerpt) suggests that something is happening (i.e. if I make font-size very small, they move up as if the font had become miniscule, when in fact it always stays the same). My reading suggests that something may be overriding my CSS commands, but I can't find what it is.

And secondly, I am trying to reduce the gutter (if that's what it's called) between rows when more than one row of posts is visible. I managed to reduce the top margin, toward the filtering categories, but have not found a way to address the space between rows.

If you have any hints, I'd be most grateful. I really tried all that I could find in the Chrome Inspector. But it's styling - the function is perfect!

Yours faithfully, Jan.

 

P.S.: (On another, though related note, I'd like to make a few suggestions for a super-charged Filtering section - it seems to me that a few additions would make it into an even more amazing section. But I shall think more carefully over this before I put pen to paper - to give you a pre-Filtered feedback rather than a rambling list of blue-sky-musings!)

Share this post


Link to post
Share on other sites

  • Similar Content

    • Michael Kummer
      By Michael Kummer+
      Hi guys,
      Is it possible, and if so, how, to change the layout of the archive pages? For example, I would like to use a smaller and more compact image size for featured images and shorten the amount of text that's displayed for each post without also changing how featured images are displayed on single post pages.
      I am talking about https://michaelkummer.com/apple/ vs How to extend the storage of your iPhone or iPad.
      Thanks
      Michael
       
    • Josiah Jones
      By Josiah Jones
      Hi,
      I'm currently using the Filtering plugin on a website that is not yet live (http://www.RetroLeaders.com/ - currently hidden by a "Coming Soon" plugin) however after updating to the most recent version of Wordpress and DMS the Filtering plugin has stopped working and is causing DMS to display the never ending load icon.
      Inspecting the code for errors I see the following problems:
      . jquery.isotope.min.js?ver=1.7.4:11 Uncaught TypeError: Cannot read property 'opera' of undefined (anonymous function) @ jquery.isotope.min.js?ver=1.7.4:11 (anonymous function) @ jquery.isotope.min.js?ver=1.7.4:11 (index):66 Uncaught TypeError: mycontainer.isotope is not a function (anonymous function) @ (index):66 jQuery.Callbacks.fire @ jquery.js?ver=1.11.2:3143 jQuery.Callbacks.self.fireWith @ jquery.js?ver=1.11.2:3255 jQuery.extend.ready @ jquery.js?ver=1.11.2:3467 completed @ jquery.js?ver=1.11.2:3498
        Can you please check if everything is working properly and provide an update if necessary? The filtering function is a crucial part of my web design and we cannot go live without it!
      Please let me know what you find.
      Best,
      - Josiah 
    • evscicats
      By evscicats
      Ellen,
       
      What version number is the latest for the Filtering section?  I have version 1.6 and hope that I'm up-to-date.  If there's a new version, how do I get the latest update and do I have to pay again?
       
      Thanks,
       
      Jerrad
    • jujutanada@gmail.com
      By jujutanada@gmail.com
      Hi, I found out that if I go to the archive of a tag e.g. http://mysite/?tag=lotd , it doesn't work. It doesn't show the correct posts tagged with lotd, --but it works for categories. It only works when I use WP Content. How do I display this using Postpins?
      And is it possible to create a different archive page for only a particular category?
       
    • jujutanada@gmail.com
      By jujutanada@gmail.com
      Hi, I found out that if I go to the archive of a tag e.g. http://mysite/?tag=lotd , it doesn't work. It doesn't show the correct posts tagged with lotd, --but it works for categories. It only works when I use WP Content. How do I display this using Postpins?
      And is it possible to create a different archive page for only a particular category?
       
×