WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] CG-Whattunes display (39 posts)

  1. slipperyamoeba
    Member
    Posted 8 years ago #

    I just recently discovered CG-Whattunes and got it installed on my website (slipperyamoeba.com) relatively pain free. My question now is, what file do I need to edit to change the appearance of how the
    song info is listed on my webpage (such as changing the font or
    completely removing the name of the album from the page)?

    Specifically, I'd like to only have the album cover image and the time the song was played displayed under the "Now Playing" header. With mouseover popping up the song tile and album @ Amazon (instead of just album @Amazon as it currently is).

    Hope that wasn't too confusing. Just looking to get pointed in the right direction.

    Josh

  2. Beel
    Member
    Posted 8 years ago #

    Just about everything Dave's plugins display are wrapped with all kinds of id's and classes. Check the source and style using those.

    span#t-now-playing {
    font-size:20px;
    }

  3. slipperyamoeba
    Member
    Posted 8 years ago #

    Thanks for the reply Beel. So, do I have to edit multiple files in order to make display changes? Or if not, do you happen to know which specific php or style sheet I need to tweak? Or even better which section of which file?

    I am trying to only have the album art displayed (no song title, album name etc. Basically no text.)

  4. Beel
    Member
    Posted 8 years ago #

    I have been using David's plugins since he first released them and have "Now Playing" "Now Reading" "Random Item" and "Wishlist" in my sidebar (along with his "Recent Referrers", "Recent Searches" and "FeedRead News" :-).

    You can just add the css to your theme style sheet or include a separate "amazon.css" in the header as I have done (check my source).

  5. davidchait
    Member
    Posted 8 years ago #

    Figured I'd respond here rather than via email, so others can learn about this stuff. ;)

    For >styling< content, just add the right CSS overrides into your theme's CSS file. Beel's right -- I typically over-wrapper things like nuts, class wrapper items, so that you can easily CSS things to make it look visually the way you want.

    However, changing what's >output< is something different. While there are some options in the getWhatsPlaying function call, doing more complex adjustments you'd need to modify the code in that function itself. Some of it is actually not even in THAT function, as it calls into CG-Amazon for the amazon output.

    To just show the image.... hmmm... there's options in cga-config.php that control that for Amazon calls, and are likely the best way to do it here. It should let you get just the image without further code mods -- but I've actually never tested this particular case/approach.

    If $showTitle (the second param to getWhatsPlaying) is false, you are basically JUST getting the amazon output, almost pure. So it's almost like you called amazon yourself -- thus all the cga-config.php settings apply: what gets shown/not shown, image size defaults (though getWhatsPlaying's last param allows that specified to override), country/locale, etc.

    If it doesn't seem readily apparent, ping here or via email and I'll try to follow up. I apologize in advance if this drops off the radar -- ping me like once a week for the next two weeks and I'll certainly get to it (I'm juggling $$ earning and $$ sucking things... ;) ).

    -d

  6. slipperyamoeba
    Member
    Posted 8 years ago #

    So, I cracked open cga-config.php as suggested by David and found this line.

    // set this true to show ONLY the product image, NO other fields. this basically infers minimumData too...
    //$amazonImageOnly = true;

    I took out the 2 preceding slashes infront of the last part, leaving

    // set this true to show ONLY the product image, NO other fields. this basically infers minimumData too...
    $amazonImageOnly = true;

    That seemed to get rid of the the album name and artist beneath the picture. But I still haven't found how to lose the song title from above the image. Any thoughts?

  7. slipperyamoeba
    Member
    Posted 8 years ago #

    Two more questions:

    1. When you mouseover the album image its border changes to blue, which is fine, but the goofy looking thing is that the border extends way out to the right on the mouseover (in firefox) or to the right and below (in explorer). Is there a way either get rid of this effect completely or to not have the border extend to far out (so, just highlight the image and not the surrounding text which is what I assume it's trying to do) ?

    2. Is there a way to display the time the last song was played?

    Thanks again for all you help?

  8. Beel
    Member
    Posted 8 years ago #

    While you wait for David's response, in the meantime have you tried using "display:hidden" in your css for what you don't want shown? Oh wait, change this:
    getWhatsPlaying(true, true)
    to:
    getWhatsPlaying(true, false)

    For your other questions the css is set to display:block and has a hover baclground color - I'd first just delete the background color and give that a whirl.

    Don't know about the time.

  9. slipperyamoeba
    Member
    Posted 8 years ago #

    Beel thanks again for the reply. I was able to fix the mouseover thing by changing the background attribute in the following to none (or white would also work for my page).

    .amazon-item-wrap a:hover
    {
    background: none;
    }

    Silly question, but, where (what file) do I find "getWhatsPlaying(true, true)?

  10. davidchait
    Member
    Posted 8 years ago #

    you mean the function call definition?
    wp-content/plugins/cg-plugins/cg-whattunes.php

    for the date... hmmm. Yeah, you can do it. A quick hacky thing would be to find the line:

    if ($showTitle && !$titleBefore) $output .= $titleout;

    ... in CG-WhatTunes.php, and add AFTER it something like:

    if (1) // showdate
    {
    $time = date('r', $np['playtime']); // 'r' can be any format string
    $output .= $preTitle.$lf; // THIS IS OPTIONAL
    if ($amazonWrapInfo!='li') $output .= '<li>'.$lf;
    if ($titleWrap) $output .= "<$amazonWrapInfo class='t-amazon'>".$lf;
    $output .= $time.$lf;
    if ($titleWrap) $output .= "</$amazonWrapInfo>".$lf;
    if ($amazonWrapInfo!='li') $output .= '</li>'.$lf;
    $output .= $postTitle.$lf; // THIS IS ALSO OPTIONAL
    }

    I haven't tried this... just off the top of my head here. You might need to remove the OPTIONAL lines, and might also need to change the wrappering class from t-amazon to something else if you are hiding the t-amazon's in CSS overrides...

    -d

  11. slipperyamoeba
    Member
    Posted 8 years ago #

    Great! Thanks David for the detailed reply. That works great for displaying the date/time on my site. I like how configurable that is too (for example changing the "r" value to a different http://us2.php.net/date value).

  12. slipperyamoeba
    Member
    Posted 8 years ago #

    Once again, thank you both Beel and David for all you help. There really is absolutely no way I could have figured any of this out by myself. A few more questions that seem like they should be straight forward but I can't figure them out.

    1. Is there a way to move the date/time the song was played underneath the album cover image?

    2. How do I change the border color around the album cover image?

    3. In Firefox the album cover image, song title, etc are jogged to the right underneath the "Now Playing" title, but not in IE. I think this is somehow my doing as I also get an error having to do with a
    [li] when I try to WC3 validate my page. Is there a simple way to nudge these back left in Firefox?

    Again many thanks!

  13. Beel
    Member
    Posted 8 years ago #

    The first question is easy, just move the code he posted further down in the function (somewhere before the output is returned)

    I'll have to spend some time thinking about your next 2 questions which should be easy, too.

  14. Beel
    Member
    Posted 8 years ago #

    Yep, you have an error in your sidebar - fix that and we will see what the layout looks like.

    As for the border, add something like:
    span.b-amazon img {border:hotpink}

    ;-)

  15. Beel
    Member
    Posted 8 years ago #

    Come to think of it, the xhtml error may be a prob with David's function. I do not use what he suggests in the docs and I think that may have been the reason why (too long ago to remember)

    This is what I use:
    <?php
    if (function_exists("getWhatsPlaying")) // then we can use it
    {
    $amaAlbum = getWhatsPlaying(true, true);
    if ($amaAlbum)
    {
    echo '<li id="now-playing">Now Playing';
    echo $amaAlbum;
    echo '</li>';
    }
    }
    ?>

    That closing li may be the reason.

  16. slipperyamoeba
    Member
    Posted 8 years ago #

    Beel, I tried your above posted function and it still gave me an xhtml error, BUT along with that it also solved about three different layout glitches I was fighting with. Much, much better. Great tip! I am definitely going with your setup.

  17. davidchait
    Member
    Posted 8 years ago #

    Cool! Looking good.

    BTW, when you want to discuss it, you can change your "This album..." link to actually be an embedded, live amazon link within the text -- CG-Amazon + CG-Inline.

    Some people hate that I don't combine everything into one (I've seen a number of Now Playing things that have an amazon album retriever 'built in'). Until they see that there's a half dozen other cool things that are enabled now that pieces of CG-PP have been activated... ;) ;)

  18. slipperyamoeba
    Member
    Posted 8 years ago #

    Ok, solved the xhtml error. It was my fault. I had the above function enclosed in my own set of [li]'s. I took these out and the problem disappeared.

    Last question (I'm pretty sure!)

    Currently when you mouseover the album image the popup text displays (album name @ AMAZON). Do you know where I would look to change the popup text to (song name, album, artist @ AMAZON)?

  19. slipperyamoeba
    Member
    Posted 8 years ago #

    Thanks for the great service David. I think you've hooked me into using your powerpack for as long as it's around. Good stuff, even for someone like me who's just bumbling his way through the code.

    What exactly are the advantages of an embedded, live amazon link within the text? Or, I suppose, what is the difference between that and what I have now?

  20. davidchait
    Member
    Posted 8 years ago #

    Hmmm... Changing the popup link text is a tricky one, because it's embedded down deep in CG-Amazon.php (and if you ever wanted an update to CG-Amazon, you'd lose any such minor mods...). Lemme think if there's any easy way that I could roll into a next version, where you wouldn't have to hack up the code.

    As for the second Q: not much if all you want is a text link. A raw CGA text link ends up with the product name (if not overridden), so if the name changed, your post would eventually reflect it.

    But, instead of just a simple text link, you could easily have a cover-image link instead. And, instead of having to generate the long-form linkage, you could just do my CG-Inline form:
    <!--amazon:SOMEASIN:SmallMedium-->
    ... or something like that. Of course, if you turned off CGA or CGI, the link WILL disappear. It's a blessing and a curse! ;)

    I've considered doing the embedded-link-info as a QuickTag like WP-Amazon does -- but the moment you do that, you lose the flexibility to, say, change the default image sizes across your site, or how they are styled/positioned, etc. Stuff like that. Certainly the moment you want to display things like Pricing, Availability, etc., you've got to be using dynamic links (bc without being dynamic, and updating every x days, using any such information beyond a certain time limit is in violation of the Amazon Web Services license agreement... it's a pain, and part of why when you start showing things like prices you need to do things like show the amazon-disclaimer thing I package in...).

    -d

  21. slipperyamoeba
    Member
    Posted 8 years ago #

    OK, really, the questions never end I suppose. If no Amazon album image is available is there any option to call a designated "no artwork/image" image? If not, no biggie. Just wondering if I'm missing something.

  22. Beel
    Member
    Posted 8 years ago #

    David, since you are prowling around here... what files are necessary to run your old CG-WMPBlog.exe with Windows Media Player? It runs on one computer but not on another so I figure I must be missing a dll.

    Oh, and the Google links to all my old "details on... " no longer brings up the details on that item, but displays the catalog. Is it history? You can get an idea of what I mean by looking at the Google cached page here:
    http://www.google.com.au/search?hl=en&q=gold+-+john+stewart&meta=

    Edit: Nevermind on the Google question, I think I just have to wait till Google gets the new way CG-Amazon works.

  23. slipperyamoeba
    Member
    Posted 8 years ago #

    David, don't worry about the popup link text if it's going to be a hassle. I honestly can't imagine too many other people actually being interested in playing around with this. I'm just sort of a sucker for a simple looking design and was looking for a way to tuck away the song info without actually having it take up space on my sidebar. Definitely not a big deal. Thanks for looking into it though.

  24. davidchait
    Member
    Posted 8 years ago #

    1. The WMPBlog.exe thing requires the WMP blogging extension thing microsoft had released. I just found my original email to you, forwarding the zipped file again...

    2. the p= thing has a quick workaround until I can release it. Go into cgaindex.php, and find the code:

    else
    $p = 0; // blank it out so we don't do weird things with text...

    Change it to (removing the else and changing the line):

    $p = stripslashes($p); // security tweak...

    3. 'missing album' artwork. Hmmm. Never thought about it. Basic answer is: not at the moment. It obviously wouldn't be hard to hack it into the 'no album' case in getWhatsPlaying... Create the matching sized icon with a ? or something, and add a IMG added to the output with your local path.

    -d

  25. TechGnome
    Moderator
    Posted 8 years ago #

    You know David, if it weren't for you, half or my sidebar wouldn't be possible. Thanks for a wonderfull tool.... All of it....

    I've got a few anomalies with mine.... but I think it's due to some missing info in the ID3 tags in the music files themselves (odd things happen when the artist isn't available -- Imagine my surprise when I was listening to Ace of Base's "The Sign" album... since the artist wasn't sent, all it had to go on was "The Sign" -- so I eneded up with the Amazon link going to Prince's "Sign the 'O' Times" .... not quite the same.... but it only happens on some files, and is fine on others.

    I do have one question though.... when I'm listening to a Shoutcast Stream, I get the stream title just fine.... but then I get three empty divs right below it.... where do those come from, and 1) how would I get right of them, or 2) fill them with other information about the cast?

    Tg

    Tg

  26. TechGnome
    Moderator
    Posted 8 years ago #

    A little experimenting shows that yep, it's my mp3 files. If I'm playing the CD directly, then the right album info gets pulled.

    This is so sweet!

    Tg

    *toddles off to see what else he can find in CG-PP*

  27. slipperyamoeba
    Member
    Posted 8 years ago #

    Beel, if you're still in the neighborhood, I really like your trackhistory.php page (page showing last 20 songs played). I'm guessing you somehow pulled the code from WordPress Tunes admin page. If this is the case, would you mind telling me where I should look to find this and if this was a tricky thing to do? Thanks in advance!

  28. Beel
    Member
    Posted 8 years ago #

    I will post the code as soon as I find the site to do that (hint-hint, somebody ;-)

    Nevermind.... found it....

  29. Beel
    Member
    Posted 8 years ago #

    Well, it wasn't that long so I could have posted it here, I guess but:
    http://paste.uni.cc/7504

  30. davidchait
    Member
    Posted 8 years ago #

    tracktunes.php has code built-in to show the song history. If you use something like CG-QuickPHP, you could likely call the function from within a Page if you wanted one for your 'Recently Heard' list. To do it with full amazon stuff would be a more complex undertaking. ;-)

    Gnome-y! Not sure why blank divs would show up. If there's nothing to go on, you shouldn't be getting anything from Amazon. I wonder if there's a tag in the ID3 POST data somewhere to identify streaming audio, and not even bother doing the amazon lookup? (since it'll fail every time, and I don't know if it'll cache the failure or keep trying...).

    -d

Topic Closed

This topic has been closed to new replies.

About this Topic