في كثير من الأحيان نحتاج إلى طريقة لعرض المحتوى المميز في الموقع مصحوباً بصور متعلقة بهذا المحتوى .

GalleryView يوفّر طريقة جذابة لعرض المحتوى مصحوباً بالصور الخاصة به و إمكانية التعديل عليها و تغيير شكلها بسهولة .

الإضافة تقوم بعرض صور مصغرة للمحتوى المميز المطلوب عرضه و يتم الانتقال بين كل محتوى و آخر خلال فترة زمنية معينة لا تستغرق ثواني , و بالضغط على أي من الصور المصغرة ينتقل إلى المحتوى الذي تم الضغط عليه مع عرض نص قصير متعلق بهذا المحتوى .

GalleryViewكيفية الاستخدام

يتم استخدام الاضافة عن طريق إضافة الكود التالي بحيث يمكن جلب المتغيرات الخاصة بها داخل <head>

1
2
3
4
5
6

$('#photos').galleryView({
	panel_width: 800,
	panel_height: 300,
	frame_width: 100,
	frame_height: 100,
});

هذه المتغيرات تحدد طول و عرض الثوابت الموجودة و هي مكان المحتوى ككل Panel , و الصور المصغرة Frame . هناك العديد من المتغيرات الأخرى و لكنها ليست ضرورية و يمكن استخدامها حسب الاختيار .
بعد ذلك يتم تكوين طريقة عرض المحتوى و هي تنقسم إلى 3 أجزاء :
1- التقسيم الأساسي و الذي يتم جلبه من الكود الذي تم إدخاله مسبقاً في 

1
2
3

<div id="photos" class="galleryview">
	...
</div>

2- مجموعة من التقسيمات و هي عبارة عن الجزء الكبير من عرض المحتوى و الذي يحتوي على الصورة ذات الحجم الكبير و العنوان و النص المختصر .

1
2
3
4
5
6
7
8
9
10

...
<div class="panel">
	<img src="img/gallery/02.jpg" />
	<div class="panel-overlay">
		<h2>Eden</h2>
		<p>Photo by <a href="http://www.sxc.hu/profile/emsago" target="_blank">emsago</a>.
		View full-size photo <a href="http://www.sxc.hu/photo/152865" target="_blank">here</a>.</p>
	</div>
</div>
...

3- التقسيم الأخير و الذي يحتوي على مجموعة الصور المصغرة Frame .

1
2
3
4
5
6
7
8
9
10

<ul class="filmstrip">
	<li><img src="img/gallery/frame-01.jpg" alt="Effet du soleil" title="Effet du soleil" /></li>
	<li><img src="img/gallery/frame-02.jpg" alt="Eden" title="Eden" /></li>
	<li><img src="img/gallery/frame-03.jpg" alt="Snail on the Corn" title="Snail on the Corn" /></li>
	<li><img src="img/gallery/frame-04.jpg" alt="Flowers" title="Flowers" /></li>
	<li><img src="img/gallery/frame-06.jpg" alt="Alone Beach" title="Alone Beach" /></li>
	<li><img src="img/gallery/frame-05.jpg" alt="Sunrise Trees" title="Sunrise Trees" /></li>
	<li><img src="img/gallery/frame-07.jpg" alt="Waterfall" title="Waterfall" /></li>
	<li><img src="img/gallery/frame-08.jpg" alt="Death Valley" title="Death Valley" /></li>
</ul>

استعراض GalleryView
# تنزيل إضافة GalleryView (الإضافة ليست متعلقة بـ WordPress و إذا تم استخدامها فيها فيجب القيام بجميع الأعمال و التعديلات بشكل يدوي أو تكوين إضافة WordPress باستخدام GalleryView .