زمان کنونی: ۱۰-۱-۱۴۰۳, ۰۸:۲۷ صبح درود مهمان گرامی! (ورودثبت نام)


ارسال پاسخ 
 
امتیاز موضوع:
  • 1 رأی - میانگین امتیازات: 5
  • 1
  • 2
  • 3
  • 4
  • 5
بهترین پلاگین برای اضافه کردن استایل دلخواه به تصاویر
۲۷-۶-۱۳۹۲, ۱۰:۴۳ عصر (آخرین ویرایش در این ارسال: ۷-۵-۱۴۰۲ ۰۹:۱۱ صبح، توسط Reza Ganji.)
ارسال: #1
Wink بهترین پلاگین برای اضافه کردن استایل دلخواه به تصاویر
Plugin joomla 3.0 Joomla 2.5 Joomla 1.5

[تصویر:  1379502750_1_edefbe0398.jpg]

درود
پلاگین Complete Image Styles بهترین پلاگین موجود برای اضافه کردن استایل های دلخواه به تصاویر با استفاده از سی اس اس می باشد.توسط این پلاگین میتوانید چندین استایل دلخواه ایجاد کنید و هنگام ایجاد مطالب فقط کلاس مورد نظر را به تصویر اضافه کنید.
دیگر نیاز نیست برای تغییر در نمایش تصاویر css قالب را ویرایش کنید و البته با ویرایش قالب هم امکان استفاده از چندین استایل محدود است.

Complete Image Styles is a Joomla plugin that provides a full collection of styles for images. Now, you can make your images much more attractive by applying to them many styles. Complete Image Styles brings together all the standard and new styles that appeared with the growth of CSS. Styles like border, shadow, rounded corners, frame, embossed, perspective, lifted corners, raised box, cutout, glowing, reflection, curves, captions and others can be applied alone or in combination.

Complete Image Styles uses only CSS and Javascript to apply the styles. No special and transparent images are needed. Of course images can also be links.

No coding skills are required. Only the plugin and a good content editor like JCE Editor or JCK Editor or CKEditor. So, wherever you have access to the editor (all articles and all modules) you can apply easily the styles. Developers who have knowledge of CSS can apply the styles to images of other Joomla extensions (like VirtueMart, SOBI, Phoca Gallery etc.) if the code of the extension allows that.

براحتی توسط این پلاگین میتوانید بردر , مارجین و تمامی خصوصیت هایی که در css3 میتوانید استفاده کنید به تصاویر دلخواه اضافه کنید.پلاگین دارای ده استایل با تنظیمات سفارشی کامل می باشد و استفاده از آن براحتی امکان پذیر است.

[تصویر:  1379503520_1_240fbad9a6.jpg]

[تصویر:  1379503548_1_afbcacdc8a.jpg]

[تصویر:  1379503578_1_62f913e574.jpg]

[تصویر:  1379503611_1_407dc6cb25.jpg]

[تصویر:  1379503628_1_0c4b7ccafa.jpg]

[تصویر:  1379503655_1_8a4eaee705.jpg]


این تصاویر چند نمونه از استایل هایی است که شما میتوانید به تصاویر اضافه کنید.در زیر تصویری از تنظیمات این پلاگین بسیار کاربردی میتوانید مشاهده کنید.

[تصویر:  1379503905_1_363a1fc3d5.png]


در زیر پارامترهای موجود برای هر استایل را نیز میتوانید مشاهده کنید :

Complete Image Styles has the following parameters for each style:

    Comment: Write a comment for the style (for example where you apply it).
    Enabled: Set if the specific style is enabled or not.
    Class (Simple User): The default class name for this style.
    CSS Selectors (Advanced User): The css selectors (type selectors, attribute selectors, ID selectors or pseudo-classes) to apply this style seperated by commas (,). Example: div#gallery img, img.news
    Margin Style
        Enabled: Enable or disable the margin style.
        Top Size: The size of the top margin in pixels.
        Right Size: The size of the right margin in pixels.
        Bottom Size: The size of the bottom margin in pixels.
        Left Size: The size of the left margin in pixels.
    Border
        Enabled: Enable or disable the border style.
        Size: The size of the border in pixels.
        Color: The color of the border. Default value: #000000
        Opacity: The opacity of the shadow. Allowed values: All decimal values from 0 to 1. Default value: 0.7
        Style: The style of the border.
        On Hover: Apply style when cursor is over the image.
    Shadow
        Enabled: Enable or disable the shadow style.
        Size: The size of the shadow in pixels. Set it to zero (0) for no shadow. Default value: 7
        Color: The color of the shadow. Default value: #000000
        Opacity: The opacity of the shadow. Allowed values: All decimal values from 0 to 1. Default value: 1
        On Hover: Apply style when cursor is over the image.
    Rounded Corners
        Enabled: Enable or disable the rounded corners style.
        Size: The size in pixels of the rounded corners. Set it to zero (0) for square corners. Default value: 10
        On Hover: Apply style when cursor is over the image.
    Round Image
        Enabled: Enable or disable the round image style. Images must have equal width and height to become circle and not oval.
        On Hover: Apply style when cursor is over the image.
    Rotation
        Enabled: Enable or disable the rotation style.
        Size: The size of the rotation in degrees. Positive integer for right direction, negative integer for left direction. Default value: -3
        On Hover: Apply style when cursor is over the image.
    Double Outlined
        Enabled: Enable or disable the double outline style.
        Inner Color: The color of the inner outline. Example: #FFFFFF
        Inner Size: The size of the inner outline in pixels. Example: 5
        Outer Color: The color of the outer outline. Example: #000000
        Outer Size: The size of the outer outline in pixels. Example: 1
        On Hover: Apply style when cursor is over the image.
    Tape
        Enabled: Enable or disable the tape style.
    Framed
        Enabled: Enable or disable the framed style.
    Pop
        Enabled: Enable or disable the pop style.
        Size: The size of the pop in pixels. Default value: 8
    Raised Box
        Enabled: Enable or disable the raised box style.
        Size: The size of the shadow in pixels. Default value: 15
        On Hover: Apply style when cursor is over the image.
    Glossy Overlay
        Enabled: Enable or disable the glossy overlay style.
    Glowing
        Enabled: Enable or disable the glowing style.
        Size: The size of the glow in pixels. Default value: 20. Looks better on dark background.
        On Hover: Apply style when cursor is over the image.
    Embossed
        Enabled: Enable or disable the card style.
        Size: The size of the emboss in pixels. Default value: 7
        On Hover: Apply style when cursor is over the image.
    Cutout
        Enabled: Enable or disable the cutout style.
        Size: The size of the cutout in pixels. Default value: 5
        On Hover: Apply style when cursor is over the image.
    Vertical Curve
        Enabled: Enable or disable the vertical curve style.
        Size: The size of the shadow in pixels. Default value: 15
    Horizontal Curve
        Enabled: Enable or disable the horizontal curve style.
        Size: The size of the shadow in pixels. Default value: 15
    Perspective
        Enabled: Enable or disable the perspective style.
        Direction: The direction of the perspective.
    Lifted Corners
        Enabled: Enable or disable the lifted corners style.
    Curled Corners
        Enabled: Enable or disable the curled corners style.
    Reflection
        Enabled: Enable or disable the reflection style.
        Size: The size of the reflection in pixels. Default value: 30.
        Color: This color must be the same with the color of the background behind the image. Default value: #FFFFFF
    External Caption
        Enabled: Enable or disable the external caption style.
        Background Color: The background color. Example: #F6F6F6
        Space: The space around the image in pixels. Example: 5
        Border Color: The color of the border around the image. Example: #CCCCCC
        Border Size: The size of the border around the image in pixels. Example: 1. Set it to zero (0) for no border.
        Font Color: The font color of the caption. Example: #333333
        Font Size: The font size of the caption in pixels. Example: 10
    Internal Caption
        Enabled: Enable or disable the external caption style.
        Background Color: The background color. Example: #000000
        Font Color: The font color of the caption. Example: #FFFFFF
        Font Size: The font size of the caption in pixels. Example: 10
    Transition Duration: The duration of the transition in seconds. Default value: 0.5

دیدن لینک ها برای شما امکان پذیر نیست. لطفا ثبت نام کنید یا وارد حساب خود شوید تا بتوانید لینک ها را ببینید.


در لینک بالا میتوانید با کلیک برروی دکمه دمو نمونه های استفاده شده از این پلاگین کاربردی را مشاهده کنید.

فیلم کوتاهی برای نحوه استفاده از این پلاگین در پیوست قرار دارد و میتوانید مشاهده کنید !


فایل‌(های) پیوست شده
How to Setup Complete Image Styles for JoomlA.zip
نوع فایل .zip
دفعات دانلود 425
اندازه 5.63 مگابایت

complete-image-styles.zip
نوع فایل .zip
دفعات دانلود 8
اندازه 601.97 کیلوبایت

امضاء Reza Ganji
انجمن پارس جوم
مشاهده‌ی وب‌سایت کاربر یافتن تمامی ارسال‌های این کاربر
نقل قول این ارسال در یک پاسخ بازگشت به بالا
 سپاس شده توسط Zhyar ، mal2moh ، mahan ، komeh ، Ayaz ، bushehr ، aslani031 ، tarenoco ، Pourdaryaei ، Mojtaba Pordel ، milad0098 ، senobary ، kind-king
ارسال پاسخ 


پیام‌های داخل این موضوع
بهترین پلاگین برای اضافه کردن استایل دلخواه به تصاویر - Reza Ganji - ۲۷-۶-۱۳۹۲ ۱۰:۴۳ عصر

پرش به انجمن:


کاربرانِ درحال بازدید از این موضوع: 1 مهمان