Editing Refactoring a CMS to Use Shared LITTLED Libraries (section)

==Details Pages==
Sample inline edit funcationality setup:
<syntaxhighlight lang="javascript" enclose="div">
$(document).ready(function(){

	/* with album-based content, this loads the gallery of images on the page */
	$('#pages-<?=$input->id->value?>').galleries('retrieveGallery', function() {
		
		/* callback code executed after the gallery is fully loaded into the DOM */
		$('#pages-<?=$input->id->value?>')

		/* with a gallery of full-sized images this would load edit & delete buttons after clicking the images */
		.galleries('bindImageOverlayHandlers')

		/* with a listings-style of presentation this would enable inline editing of keywords within the gallery */
		.keywords('bindListingsHandlers');
	});

	/* adds edit and delete buttons to thumbnail image */
	/* this works for both album-based thumbnails and stand-alone images linked to the parent record */
	$('.image-upload-container').galleries('bindImageOverlayHandlers');

	/* enables inline editing of keywords */
	$('.metadata').keywords('bindListingsHandlers');

	/* optional key navigation through records */
	$(document).listings('bindKeyPageNavigation', {
		leftKeyURL: '<? if ($filters->prev_id > 0): print([CONTENT_SLUG]_DETAILS_URI."{$sParam}&id={$filters->prev_id}"); else: print([CONTENT_SLUG]_URI.$sParam); endif; ?>',
		rightKeyURL: '<? if ($filters->next_id > 0): print([CONTENT_SLUG]_DETAILS_URI."{$sParam}&id={$filters->next_id}"); else: print([CONTENT_SLUG]_URI.$sParam); endif; ?>',
		upKeyURL: '<?=[CONTENT_SLUG]_URI.$sParam ?>'
	});
}
</syntaxhighlight>

* For image and thumbnail uploads, and album-based content types displaying galleries:
** [[Albums CMS Configuration]]
** [[Album Image Uploads]]
* See also [[Neighbor Links Navigation]]

[[Category:CMS Documentation]]