ایجاد فریم دور عکس

[علی نظری 3]

با سلام 

 

 

میخواهیم دور عکسی که در مطالب قرار میدهم یک فریم  شیک و ساده داشته باشم.

 

گالری عکس نمیخواهم . فقط یک فرم دور عکس 

 

 

خبرنامه ای  دارم که هر خبر حداقل یک عکس داره،

 

کلی ماژول و کامپوننت هم نصب شده دارم

 

مثل K2 

 

 

چه ماژولی اینکار را اتوماتیک انجام میدهد ؟

 

کمک کنید. لطفا

 

 

مثل تصویر :

 

 

 

[farhad6169 125]

با سلام

 

اين كدها رو به آخرين خط يكي از  cssهاي قالبتون اضافه كنيد.

 

.picstyles {
    margin: 10px;
    border:solid #fff 7px;
    box-shadow: 0 0 5px #999999;
    border-radius:5px;}

 

اگر فايلي به نام template.css در فايل هاي css قالبتون بود كه به انتهاي آن اضافه كنيد اگر هم نبود دموي سايتتون رو بگذاريد تا بتونم بگم در كدام فايل قرار بديد.

 

بعد از قرار دادن اين كدها هروقت خواستيد كه عكسي بصورتي كه خواستيد بشه فقط كافيه كلاس عكس رو picstyles قرار بديد.

 

حتي شما مي توانيد بگيد كه عكس هايي كه قرار ميديد، تمامي عكس هاتون از طول و عرض يكساني استفاده كنند كه اين براي هرچه منظم تر شدن عكس هاتون كمك مي كنه

 

براي انجام اين كار كافيه بجاي كدهاي بالا كدهاي زير رو در انتهاي خط فايل css خود قرار بديد

 

.picstyles {
    margin: 10px;
    border:solid #fff 6px;
    box-shadow: 0 0 5px #999999;
    border-radius:5px;
    width:100px;
    height:85px;}

 

 

نمونه انجام شده اين كار همراه كدهاي استفاده شده

كليك كنيد

 

 

 

موفق باشيد

ویرایش شده شهریور 92 توسط فرهاد سليماني

[علی نظری 3]

با سلام

 

اين كدها رو به آخرين خط يكي از  cssهاي قالبتون اضافه كنيد.

 

.picstyles {

    margin: 10px;

    border:solid #fff 7px;

    box-shadow: 0 0 5px #999999;

    border-radius:5px;}

 

اگر فايلي به نام template.css در فايل هاي css قالبتون بود كه به انتهاي آن اضافه كنيد اگر هم نبود دموي سايتتون رو بگذاريد تا بتونم بگم در كدام فايل قرار بديد.

 

بعد از قرار دادن اين كدها هروقت خواستيد كه عكسي بصورتي كه خواستيد بشه فقط كافيه كلاس عكس رو picstyles قرار بديد.

 

حتي شما مي توانيد بگيد كه عكس هايي كه قرار ميديد، تمامي عكس هاتون از طول و عرض يكساني استفاده كنند كه اين براي هرچه منظم تر شدن عكس هاتون كمك مي كنه

 

براي انجام اين كار كافيه بجاي كدهاي بالا كدهاي زير رو در انتهاي خط فايل css خود قرار بديد

 

.picstyles {

    margin: 10px;

    border:solid #fff 6px;

    box-shadow: 0 0 5px #999999;

    border-radius:5px;

    width:100px;

    height:85px;}

 

 

نمونه انجام شده اين كار همراه كدهاي استفاده شده

كليك كنيد

 

 

 

موفق باشيد

دوست عزیزم

قبلا هم خیلی کمک بهم کردی

 

این http://www.iranmct.com/

 

یک راهنمایی بده.من تو پوشه قالبم خیلی فایل css هست .کدومشه

دیگه اینکه . کجاباید این خاصیتو  picstyles موقع اپلود عکس جدید معرفی کنم تا عکسای جاهای دیگه فریم دار نشن؟

میخواهم از همان مورد اولی که فرمودی استفاده کنم.

 

چون عکسای خبرها یک اندازه نیستند.

 

خودش یک فریم را با اندازه ثابت برای همه عکس در نظر بگیرد

 

تشکرات

[farhad6169 125]

با سلام

 

كدها رو بايد در آخرين خط از مسير زير وارد كنيد.

 

templates > bd_beauty > css > layout.css

 

اگر بخواهيد كه تمامي عكس هاي سايت تون بدون دخالت شما اين استايل رو بگيره بايد كد زير رو در آخرين خط فايل گفته شده وارد كنيد

 

img {
margin: 10px;
border:solid #fff 10px;
box-shadow: 0 0 10px #999999;
border-radius:5px;}

 

 

ولي اگر بخواهيد كه فقط عكس هايي كه خودتان مي خواهيد داراي اين استايل باشند ميبايست كد زير رو در آخرين خط از فايل گفته شده وارد كنيد

 

.picstyle {
margin: 10px;
border:solid #fff 10px;
box-shadow: 0 0 10px #999999;
border-radius:5px;}

 

بعد هربار كه عكس آپلود مي كنيد درون مطلب طبق عكس پيوست شده به ترتيب شماره جلو برويد تا استايل را به عكس اعمال كنيد

 

عكس راهنما

 

1- روي عكس كليك كنيد

2- گزينه شماره 2 كه عكس درخت است رو بفشاريد

3- وارد تب نشان داده شده بشويد

4- در مكان نشان داده شده تايپ كنيد picstyle

5- كليد update رو بفشاريد

 

به همين راحتي

 

نمونه انجام شده

 

موفق باشيد

ویرایش شده شهریور 92 توسط فرهاد سليماني

[علی نظری 3]

با سلام

 

كدها رو بايد در آخرين خط از مسير زير وارد كنيد.

 

templates > bd_beauty > css > layout.css

 

اگر بخواهيد كه تمامي عكس هاي سايت تون بدون دخالت شما اين استايل رو بگيره بايد كد زير رو در آخرين خط فايل گفته شده وارد كنيد

 

img {

margin: 10px;

border:solid #fff 10px;

box-shadow: 0 0 10px #999999;

border-radius:5px;}

 

 

ولي اگر بخواهيد كه فقط عكس هايي كه خودتان مي خواهيد داراي اين استايل باشند ميبايست كد زير رو در آخرين خط از فايل گفته شده وارد كنيد

 

.picstyle {

margin: 10px;

border:solid #fff 10px;

box-shadow: 0 0 10px #999999;

border-radius:5px;}

 

بعد هربار كه عكس آپلود مي كنيد درون مطلب طبق عكس پيوست شده به ترتيب شماره جلو برويد تا استايل را به عكس اعمال كنيد

 

عكس راهنما

 

1- روي عكس كليك كنيد

2- گزينه شماره 2 كه عكس درخت است رو بفشاريد

3- وارد تب نشان داده شده بشويد

4- در مكان نشان داده شده تايپ كنيد picstyle

5- كليد update رو بفشاريد

 

به همين راحتي

 

نمونه انجام شده

 

موفق باشيد

 

 

دوست عزیز

کد شما را  در css قرار دادم ولی نشد.

فکر میکنم ادیتور من با شما فرق داره.

اگر ادیتور بهتری سراغ دارید به من بگید تا من هم نصب کنم.

اسکرین شاتشو میزارم 

کد دستیش اینگونه باید باشه ؟

 

  "img style="border:picstyle >

[farhad6169 125]

با سلام

 

كدها رو ديدم، به درستي قرار داده بوديد. براي پيشرفته كردن اديتورتون هم بصورت عكس راهنما عمل كنيد.

 

 از منوي افزونه ها وارد پلاگين ها شده و پلاگين

ویرایشگر - TinyMCE

رو انتخاب كنيد بعد از منوي كشويي عملكرد گزينه توسعه يافته رو انتخاب كنيد تا ويرايشگرتون اين قابليت بهش اضافه بشه

 

عكس راهنما

 

 

اگر با كد دستي مي توانيد كار كنيد هم بصورت زير بايد وارد كنيد

 

<img src="yourfile address.jpg" alt=" your alt" width="366" height="555" class="picstyle" />
 

 

موفق باشيد

ویرایش شده شهریور 92 توسط فرهاد سليماني