PHP中的超链接自动生成图像

时间:2014-06-03 07:47:37

标签: php css wordpress

我正在使用Wordpress' Simplicity-Lite Theme为我的第一个客户建立一个网站。

我想以某种方式改变主题,以便在特色框位置(幻灯片下方的右下方)超链接我的图像,以在同一窗口中打开一个页面。

问题在于,图像是由PHP脚本自动生成/提取的,脚本从媒体库中选取它们,因此一个脚本可以为所有八个图像完成所有操作。

我想让这些图像中的每一个都被PHP链接到自己的页面,以便为我的网站添加交互性但是我已经尝试了几件事,但在 style.css 中都是徒劳的以及 featured-box.php 文件。

我认为这是因为我无法找到超链接的元素,因为它是自动生成的。

下面是 feature-box.php 文件中PHP脚本的一部分,它提取8个图像并将它们放在特色框位置:

<div id="featured-boxs">
<?php foreach (range(1,8) as $fboxn) { ?>
<span class="featured-box"> 
<img class="box-image" src="<?php echo of_get_option('featured-image' . $fboxn,   get_template_directory_uri() . '/images/featured-image' . $fboxn . '.png') ?>"/>
<h3><?php echo of_get_option('featured-title' . $fboxn, 'Simplicity Theme for Small  Business'); ?></h3>
<div class="content-ver-sep"></div><br />
<p><?php echo of_get_option('featured-description' . $fboxn , 'The Color changing  options of Simplicity will give the WordPress Driven Site an attractive look. Simplicity  is super elegant and Professional Responsive Theme which will create the business widely  expressed.'); ?></p>
</span>

以下是呈现图片的 style.css 文件中的代码:

#featured-boxs{padding:0 0 10px;display:block; margin: 0 -30px; text-align:center;}
.featured-box{width:210px;margin:0 15px 10px; display:inline-block; text-align:left;  vertical-align:top;}

.featured-box h3{font-family:Verdana, Geneva, sans-serif;font-weight:100;font-  size:15px;color:#555555;}
#featured-boxs h2{font-family:Verdana, Geneva, sans-serif;font-weight:100;font- size:19px;color:#555555;}
.featured-box-first{padding:20px 0;width:210px;margin:0;}
#featured-boxs img.box-image{border:3px solid #EEEEEE;width:202px;height:100px;}
#featured-boxs img.box-image:hover{box-shadow:0 0 11px 0px #555555;}
#featured-boxs img.box-icon{width:50px;height:50px;}
h3.featured-box2{width:140px;float:right;}

1 个答案:

答案 0 :(得分:0)

这些精选的“帖子”是从您的主题选项中提取的。您需要在“精选标题”和“精选图片”中添加新的“精选链接”选项。

我没有测试过以下步骤,但你会明白这一点。

1。为Simplicity Lite添加超链接选项

将此超链接选项添加到 simplicity-lite / inc / options.php

89/90 行中
$options[] = array(
  'name' => 'Hyperlink', 
  'desc' => 'Input the link for the Featured Areas.', 
  'id' => 'featured-hyperlink' . $fbsinumber,
  'std' => '#',
  'type' => 'text', );

保存文件,您会在主题选项中看到一个新选项。

2。输出链接

您可以使用主题选项附带的此功能从您的设置中提取信息: of_get_option()。此函数接受两个参数:namedefault value。您可以在 simplicity-lite / inc / options-framework.php 中找到更多相关信息, 383

让我们将每张图片用a标记和href封装到您设置中存储的字符串中。

simplicity-lite / featured-box.php ,第 12行

<img class="box-image" src="<?php echo of_get_option('featured-image' . $fboxn, get_template_directory_uri() . '/images/featured-image' . $fboxn . '.png') ?>"/>

变为

<?php echo of_get_option('featured-image' . $fboxn) ? '<a href="' . of_get_option('featured-hyperlink' . $fboxn) . '">' : ''; ?>
  <img class="box-image" src="<?php echo of_get_option('featured-image' . $fboxn, get_template_directory_uri() . '/images/featured-image' . $fboxn . '.png') ?>"/>
<?php echo of_get_option('featured-image' . $fboxn) ? '</a>' : ''; ?>