رفتن به مطلب
WP4All

کادر و نوشته ی لینک دار زیر عکس ؟

پست های پیشنهاد شده

سلام.

من میخام مثل این سایت زیر عکس هام نوشته کارد دار بیاد و لینک دارش کنم .

این چطور امکان پذیره ؟

http://www.wrzko.eu/

به اشتراک گذاری این ارسال


لینک به ارسال

سلام.

من میخام مثل این سایت زیر عکس هام نوشته کارد دار بیاد و لینک دارش کنم .

این چطور امکان پذیره ؟

http://www.wrzko.eu/

دوست عزیز برای از css باید تو قالتون استفاده کنید برای کادر از کد زیر استفاده کنید و به متتون استایل بدید


border: 1px solid #CBCBCB

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


<a href="link">tozihat</a>

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

ویرایش شده توسط XeonIran

به اشتراک گذاری این ارسال


لینک به ارسال

سلام

خیلی سادست یک باکس درست میکنید و درون اون باکس یک عکس میذارید و زیر اون هم یک لینک قرار میدید و بعد با css بهش استایل میدید .

من براتون یک نمونه درست کردم که میتونید ازش استفاده کنید اگر تغییراتی خاصی رو میخواهید انجام بدید و کد نویسی بلد نیستید همینجا اعلام کنید تا براتون انجام بدم

لینک : http://cdpn.io/dhemL

به اشتراک گذاری این ارسال


لینک به ارسال

دوست عزیز برای از css باید تو قالتون استفاده کنید برای کادر از کد زیر استفاده کنید و به متتون استایل بدید


border: 1px solid #CBCBCB

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


<a href="link">tozihat</a>

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

سلام

خیلی سادست یک باکس درست میکنید و درون اون باکس یک عکس میذارید و زیر اون هم یک لینک قرار میدید و بعد با css بهش استایل میدید .

من براتون یک نمونه درست کردم که میتونید ازش استفاده کنید اگر تغییراتی خاصی رو میخواهید انجام بدید و کد نویسی بلد نیستید همینجا اعلام کنید تا براتون انجام بدم

لینک : http://cdpn.io/dhemL

ممنون از دو دوست .

من کد نویسی نمیدونم و عکسی که RapiD AM عزیز گذاشتی همونی هست که میخام .

لطفا قدم به قدم بگید چیکار کنم .

کد هاش رو هم بزار برام .

ممنون ازت .

سایت من انگلیسی هستش متونش انگلیسی باشه .

http://www.rls-movies.com/

میخام یه گزینه هایی اضافه بشه برام توی ادیتور که مثل سایت نمونه برا بازی های مثلا بزارم ign و nfo و..

http://www.wrzko.eu/games/pc/

برا فیلم ها imdb و sample و ....

http://www.wrzko.eu/movies/

ویرایش شده توسط WP4All

به اشتراک گذاری این ارسال


لینک به ارسال

عکس نیست دوست عزیز پیش نمایش طرحی هستش که کد نویسی شده به هر حال .

باکس رو با زمینه دلخواه براتون درست کردم و تغییراتی که خواسته بودید براتون گذاشتم .

برای فراخوان زمینه دلخواه از box-1 و box-2 استفاده کنید مثلا اگر پست مربوط به بازی هستش در زمینه دلخواه عنوان رو box-1 یا box-2 قرار بدید و مقدار رو مثلا IGN یا Ubisoft قرار بدید .

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

کد های HTML :


<div class="box-img">


<?php the_post_thumbnail(); ?>;


<ul>
<li><a href="<?php the_permalink(); ?>">More</a></li>
<li><a><?php echo get_post_meta ($post->ID, 'box-1',ture); ?></a></li>
<li><a><?php echo get_post_meta ($post->ID, 'box-2',ture); ?></a></li>
</ul>


</div>

کد های CSS :



.box-img {

width:600px;
height:auto;
background:#efefef;
border:1px solid #c6c6c6;
border-radius:3px;
padding-bottom: 40px;
}

.box-img img {

width:580px;
height:150px;
margin:5px auto;
display: block;
border:2px solid #fff;
border-radius:15px;
}
.box-img ul {

display: block;
margin-right: 140px;


}
.box-img ul li {

padding-right: 10px;
float: right;
list-style:none;
}

.box-img a {
display: block;
text-align:center;
width:80px;
margin:0px auto;
color:#fff;
text-decoration:none;
padding: 2px;
border:1px solid #007cba;
border-radius:4px;
background: #499bea; /* Old browsers */
background: -moz-linear-gradient(top, #499bea 0%, #207ce5 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#499bea), color-stop(100%,#207ce5)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #499bea 0%,#207ce5 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #499bea 0%,#207ce5 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #499bea 0%,#207ce5 100%); /* IE10+ */
background: linear-gradient(to bottom, #499bea 0%,#207ce5 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#499bea', endColorstr='#207ce5',GradientType=0 ); /* IE6-9 */

}

.box-img a:hover {

background: #4096ee; /* Old browsers */
background: -moz-linear-gradient(top, #4096ee 0%, #4096ee 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4096ee), color-stop(100%,#4096ee)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #4096ee 0%,#4096ee 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #4096ee 0%,#4096ee 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #4096ee 0%,#4096ee 100%); /* IE10+ */
background: linear-gradient(to bottom, #4096ee 0%,#4096ee 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4096ee', endColorstr='#4096ee',GradientType=0 ); /* IE6-9 */

}

ویرایش شده توسط RapiD AM

به اشتراک گذاری این ارسال


لینک به ارسال

تشکر .

الان من کد های HTML و CSS که دادید رو توی کدوم قسمت قرار باید بدم ؟

باید وقتی که میخام پست بزنم برای هر پست این کد ها رو بزارم تو ادیتور ؟

مقدار رو IGN بزارم یعنی بجای ID بزارم IGN یا ... ؟

بدین شکل :

لینکی که وقتی رو نوشته کلیک میکنی میره به اون صفحه رو کجا باید تعیین کرد؟


<div class="box-img">

<?php the_post_thumbnail(); ?>;

<ul>
<li><a href="<?php the_permalink(); ?>">More</a></li>
<li><a><?php echo get_post_meta ($post->IGN, 'box-1',ture); ?></a></li>
<li><a><?php echo get_post_meta ($post->Ubisoft, 'box-2',ture); ?></a></li>
<li><a><?php echo get_post_meta ($post->SAMPLE, 'box-3',ture); ?></a></li>
</ul>


</div>

به اشتراک گذاری این ارسال


لینک به ارسال

تشکر .

الان من کد های HTML و CSS که دادید رو توی کدوم قسمت قرار باید بدم ؟

باید وقتی که میخام پست بزنم برای هر پست این کد ها رو بزارم تو ادیتور ؟

مقدار رو IGN بزارم یعنی بجای ID بزارم IGN یا ... ؟

بدین شکل :

لینکی که وقتی رو نوشته کلیک میکنی میره به اون صفحه رو کجا باید تعیین کرد؟


<div class="box-img">

<?php the_post_thumbnail(); ?>;

<ul>
<li><a href="<?php the_permalink(); ?>">More</a></li>
<li><a><?php echo get_post_meta ($post->IGN, 'box-1',ture); ?></a></li>
<li><a><?php echo get_post_meta ($post->Ubisoft, 'box-2',ture); ?></a></li>
<li><a><?php echo get_post_meta ($post->SAMPLE, 'box-3',ture); ?></a></li>
</ul>


</div>

خیر دوست عزیز شما کلا مثل اینکه صفر کیلومتر هستید :D

ویرایشگر پوسته خودتون رو باز کنید و کد های فایل index رو قرار بدید اینجا

کدهای css رو هم به آخرین خط شیوه نامه (style.css) قالب اضافه کنید

کدهای فایل index رو بذارید بدید تا براتون اوکی کنم .

به اشتراک گذاری این ارسال


لینک به ارسال

بله من کد نویسی آک بندم :D

این کد های index من :

http://paste2.org/Z9WvEtw5

این هم کد های style.css :

http://paste2.org/fjUGt8fJ

تشکر ازت .

به اشتراک گذاری این ارسال


لینک به ارسال

به نظر میاد فایلی که حلقه مطالب در اون هستش در یک فایل دیگست اگر براتون ممکنه و قالب رایگان هستش فایل قالب رو در اینجا اپلود کنید تا برسی کنم .

به اشتراک گذاری این ارسال


لینک به ارسال

به نظر میاد فایلی که حلقه مطالب در اون هستش در یک فایل دیگست اگر براتون ممکنه و قالب رایگان هستش فایل قالب رو در اینجا اپلود کنید تا برسی کنم .

RapiD AM عزیز برات ارسال کردم .

به اشتراک گذاری این ارسال


لینک به ارسال

به گفتگو بپیوندید

هم اکنون می توانید مطلب خود را ارسال نمایید و بعداً ثبت نام کنید. اگر حساب کاربری دارید، برای ارسال با حساب کاربری خود اکنون وارد شوید .

مهمان
ارسال پاسخ به این موضوع ...

×   شما در حال چسباندن محتوایی با قالب بندی هستید.   حذف قالب بندی

  تنها استفاده از 75 اموجی مجاز می باشد.

×   لینک شما به صورت اتوماتیک جای گذاری شد.   نمایش به صورت لینک

×   محتوای قبلی شما بازگردانی شد.   پاک کردن محتوای ویرایشگر

×   شما مستقیما نمی توانید تصویر خود را قرار دهید. یا آن را اینجا بارگذاری کنید یا از یک URL قرار دهید.


×
×
  • اضافه کردن...