This can be added quite simply...

I'm using this in my artist view - well, actually, inside the detailled_album view that lists albums by the artist.

Here's the code you'd need to add to the file 'components/com_muscol/views/artist/tmpl/detailled_album.php'

detail_album->review;

if (strlen($intro_review) > 300) {

							

  // truncate string

  $stringCut = substr($intro_review, 0, 300);

							

  // make sure it ends in a word so assassinate doesn't become ass...

  $intro_review = substr($stringCut, 0, strrpos($stringCut, ' ')); 

}

echo $intro_review;

?>... Find out more & listen to this album here

Change the 300 to the number of characters you wish to trim your review to...

That's it!

Hope it helps!

Gez

Sorry!!!

Code attached- it keeps getting stripped from above!



Gez [file name=detailled_album_readmore.zip size=869]http://www.joomlamusicsolutions.com/images/fbfiles/files/detailled_album_readmore.zip[/file]

learnthrusong,

Where would this file go? I can't seem to find a good place to paste the code into detailed_album.php. I tried putting it in the artist\\tmpl\\common.php Replacing part of the code around line 96 that echos the artist review, but then all I get is a link showing up instead of any of the review.

Any suggestions? Thank you.

EDIT: I put the code in between the review divs at line 97 in the views\\artist\\tmpl\\common.php I had to change the detail_album in the top of your file to artist and that seem to make it so the review would show up truncated. However I click on the link, instead of showing me the full text, it stays truncated.

Any ideas?

@greengeek

Morning!

Sorry, the code in the file that I attached to previous post would need to go into the file 'views/artist/tmpl/detailed_album.php' - as I have it at least. This way, you get a 'readmore' for each album listed on the artist page as in the screenshot:


I've done a massive amount of customisation in all of my view/tmpl files to match my rockettheme template so I thought it'd be easier to upload that whole file as example....

Please see attached file.
[file name=detailed_album.zip size=2947]http://www.joomlamusicsolutions.com/images/fbfiles/files/detailed_album.zip[/file]

Hope this helps,

Gez

Ahh, I see. Just checked out your site and it looks nice. Interesting use for the read more on the albums list.

What I am hoping for is that MC will allow for content plugins to be used on the text fields. Even if its just the basic built in ones like the Read More button that is below the text editor. That way one can limit the length of the review of an album or biography of the artist that shows upon initial page load.

Hi greengeek,

One question - Do you want it to just 'reveal' the rest of the text or take you to another page that contains the 'full' text?

'Revealing' it, i.e. showing a default intro text div on the page load then using javascript in an onClick funtion to hide the intro text div and reveal the full text would be the easiest option. This is because linking to another page where you could view the full text would involve coding another view to link to.

To go down the 'reveal' route, you'd need to add a javascript function to swap the div (intro/full). Then using the a tag in the 'readmore', the src attribute would need to be set to something like

javascript:showHideIntroText();

where showHideIntroText is the name of the function that makes the relevant div hidden or visible.

The function itself would need to be in the head of your page to work.

Does this make sense?

Gez

If you wanted to go this route, a script something like this would do it:

//init vars

var fullTextDiv = "";

var introTextDiv = "";



function showHideIntroText(intro, full){ 

	fullTextDiv = full;

	introTextDiv = intro;

	// If intro div is hidden

 	if (document.getElementById(introTextDiv).style.display == 'none'){

 		//show intro text div

    	document.getElementById(introTextDiv).style.display = '';

    	// hide Full text

    	document.getElementById(fullTextDiv).style.display = 'none';

  } else {

 		//hide intro text div

    	document.getElementById(introTextDiv).style.display = 'none';

    	// show Full text

    	document.getElementById(fullTextDiv).style.display = '';

  }

}// end function

Then all you need in your view file is;
1 - A div inside which you render your introtext with a unique id, say, div id="introText"
2 - A div for your full text like div id="fullText"

Providing that your div id's are as above, the code inside your readmore a tags you'd need to trigger the function would be

// For your intro div

javascript:showHideIntroText(introText, fullText) with text 'Expand'

// For your Fulltext div

javascript:showHideIntroText(introText, fullText) with text 'Collapse'

All you need to do is save the function in a js file, store it on your server and include a js declaration pointing to the src, placed in the head of the views in which you want to use it. This is a better option than storing it in a music collection js file as it won't get overwritten on upgrades. You will only have to add the one js declaration above.

Let me know how you get on with it! FYI I've not tested this, just thrashed it out but should be most of the way there at least! If you run into any trouble, add single-quotes around the params in the javascript:showHideIntroText(introText, fullText) like;

javascript:showHideIntroText('introText', 'fullText').

Hope this helps!

Gez

@learnthrusong

Thank you for the code! I will have to give it a try.

Ideally it would be nice to have the truncated text shown, but then when one clicks read more it would show the full text on the same page. I was working on something like this earlier, but I could not get my php var to pass in the javascript. Was trying to use the innerhtml on a div with the javascript.

I will take a look at your code and give it a try. I really like the idea of how you have the length set in the code so that its more dynamic and automatic and I don't have to set it in the editor on every long review.

Thanks again!

Ideally it would be nice to have the truncated text shown, but then when one clicks read more it would show the full text on the same page. Was trying to use the innerhtml on a div for the javascript.

All being well, that's exactly what the js function will do for you...

Hope it works!

Gez

I am not having much luck getting this script to work. Probably I am just not understanding it correctly as I am still fairly new to javascript. I have made the changes from the last few posts, but when I click on them nothing happens.

This is what my common.php file looks like, mainly calling the js at the top and the changes I made at line 100 to 117:

http://pastebin.ca/2137895

This is the readmore.js file

http://pastebin.ca/2137896

Any suggestions? Thank you for your help.

Hi greengeek,

just popped over to your site to look at the sourcecode of your artist page at;
http://www.kevinbluemel.com/about

It doesn't appear as if the file you've uploaded is referenced correctly as I can't see it.

As you've referenced it with a relative link, src="/readmore.js", your browser would expect to see it in your root (httpdocs, htdocs or public_html) folder.

Where have you stored the file?

Also, where you declare the script, it would need to be in the head tag of the page.

To ensure that it is always loaded I would maybe add it to the head of your template's index file. To avoid any conflicts between any other scripts, I'd also rename it - add a number string after it or something.

I would also recommend using an absolute path to the file like;
(scripttags here) src="http://www.kevinbluemel.com/readmore-19042012.js".

That should do it hopefully.

Best of luck,

Gez

@greengeek

Hi there,

Just wanted to confirm that I've checked the script and I can barely believe it, but it worked first time... I don't really know javascript that well, however my memory must be better than I thought!

Also, just to clarify, when I said, add the script declaration in the head of your template's index file, this is most likely to be called, 'index.php' and will be located in your '/templates/[name_of_the_template_you_use]/' directory. Add the script declaration inside the head tags there...

[hide]To see a real basic example of it working, I put a temp html page on my server at: https://www.learnthrusong.co.uk/readmore-script-test.html[/hide]

Best of luck,

Gez

+1 B)

You Rock!!! I must of had an error when I did it last. I copy and pasted your last example around the code in my page and it worked great!!!

Thank you tons!

No probs,

It may have been that, earlier, I didn't enclose the js params in single-quotes in the code I sent earlier... It's possible that if you copied it straight, it wouldn't have worked...

glad it was of use.

Gez

This is great news guys
Any chance of an idiot's guide for the likes of me
Or I could give FTP access
Kind regards
Gates

Here are some simple instructions that tell you what to copy and paste to get this to work. Please let me know if it works for you. All credit and thanks to learnthrusong for providing the majority of this code. It is all based on his great code and tips he provided above!

[file name=readmore_artist_bio.zip size=1230]http://www.joomlamusicsolutions.com/images/fbfiles/files/readmore_artist_bio.zip[/file]

When I get some time, probably this weekend, I am going to add this to the other review fields as well. I will post the how tos as well, though they should be pretty much the same as this one, just different files to edit.

Hey there!

I just had a thought, something that may be obvious but as I hadn't actually said it - This readmore function strips all of the HTML tags out of the review to suit my purposes.

If you don't want that, i.e. you want to limit the text length but put the tags back in that would be a bit more complicated. However, this could be done with some regex pattern matching in php by
1 - exploding into an array of open/closing tags & the text enclosed in between the tags
2 - trim all of the text elements in the array
3 - strlen the imploded the text elements - re-adding the spaces
4 - get the index of the text element that contains the last character you want to include, strip everything past that character and append '...'
5 - grab the closing tag element of the same index
6 - Loop through the array, outputting each element's opening tag, text and closing tag until you reach an array index greater than that identified in step 4

Done!

Thanks @greengeek for taking the time to add to/cleanup the tut!

Gez