opencart - 向 OpenCart 3 添加新模块位置

Question

我正在使用 OpenCart 版本 3.0.2。

默认情况下，OpenCart 有 4 个区域，我们可以在其中放置模块到我们的布局中。即

1. 左栏
2. 右栏
3. 热门内容
4. 底部内容

我的问题是，我们是否可以以某种方式将模块也放在其他地方，或者我们是否可以以某种方式调用 HTML 模块中的模块并使用一些 HTML 代码进行包装。基本上我坚持这样一种设计，我想在主页中添加一些动态横幅，但要根据设计显示它们，它们大多被包装在行中，而不是每个 col-6，因为 Bootstrap 是我使用的框架。

为了详细说明我的要求，我正在编写示例 HTML，以便我可以显示我想为主页添加模块的位置

<header></header>
<div id="home" class="row">
    <div class="col-12"> Slideshow Module as "content top" </div>
    <div class="col-6"> Big Banner Module </div>
    <div class="col-6"> Few more Banners </div>
    <div class="col-12"> Latest Products Module as "content Bottom" </div>
    <div class="col-12"> Featured Products Module as "content Bottom" </div>
    <div class="col-12"> HTML CONTENT Module as "content Bottom" </div>
</div>
<footer></footer>

我有可能在左列和右列中删除大横幅模块和更多的横幅模块，并使用一些 jQuery 来更改来自 <aside id="column-left"> 的列的包装 HTML至 <div class="col-6">但这个解决方案似乎并不正确，也会影响谷歌抓取。

有人会建议一个更好的方法来为主页添加这样的模块吗？

如果我无法用 HTML 解释问题，请提供一张结构图:

Answer 1

您需要创建新职位。

文件:

admin/language/en-gb/design/layout.php

查找:

$_['text_content_bottom']

在它之前添加:

$_['text_content_new']    = 'Content New';

文件:

admin/view/template/design/layout_form.twig

查找:

<table id="module-content-top" class="table table-striped table-bordered table-hover">

在它之前添加:

<table id="module-content-new" class="table table-striped table-bordered table-hover">
  <thead>
    <tr>
      <td class="text-center">{{ text_content_new }}</td>
    </tr>
  </thead>
  <tbody>
    {% for layout_module in layout_modules %}
    {% if layout_module.position == 'content_new' %}
    <tr id="module-row{{ module_row }}">
      <td class="text-left"><div class="input-group">
          <select name="layout_module[{{ module_row }}][code]" class="form-control input-sm">
            {% for extension in extensions %}
            <optgroup label="{{ extension.name }}">
            {% if not extension.module %}
            {% if extension.code == layout_module.code %}
            <option value="{{ extension.code }}" selected="selected">{{ extension.name }}</option>
            {% else %}
            <option value="{{ extension.code }}">{{ extension.name }}</option>
            {% endif %}
            {% else %}
            {% for module in extension.module %}
            {% if module.code == layout_module.code %}
            <option value="{{ module.code }}" selected="selected">{{ module.name }}</option>
            {% else %}
            <option value="{{ module.code }}">{{ module.name }}</option>
            {% endif %}
            {% endfor %}
            {% endif %}
            </optgroup>
            {% endfor %}
          </select>
          <input type="hidden" name="layout_module[{{ module_row }}][position]" value="{{ layout_module.position }}" />
          <input type="hidden" name="layout_module[{{ module_row }}][sort_order]" value="{{ layout_module.sort_order }}" />
          <div class="input-group-btn"> <a href="{{ layout_module.edit }}" type="button" data-toggle="tooltip" title="{{ button_edit }}" target="_blank" class="btn btn-primary btn-sm"><i class="fa fa-pencil"></i></a>
            <button type="button" onclick="$('#module-row{{ module_row }}').remove();" data-toggle="tooltip" title="{{ button_remove }}" class="btn btn-danger btn-sm"><i class="fa fa fa-minus-circle"></i></button>
          </div>
        </div></td>
    </tr>
    {% set module_row = module_row + 1 %}
    {% endif %}
    {% endfor %}
  </tbody>
  <tfoot>
    <tr>
      <td class="text-left"><div class="input-group">
          <select class="form-control input-sm">
            <option value=""></option>
            {% for extension in extensions %}
            <optgroup label="{{ extension.name }}">
            {% if not extension.module %}
            <option value="{{ extension.code }}">{{ extension.name }}</option>
            {% else %}
            {% for module in extension.module %}
            <option value="{{ module.code }}">{{ module.name }}</option>
            {% endfor %}
            {% endif %}
            </optgroup>
            {% endfor %}
          </select>
          <div class="input-group-btn">
            <button type="button" onclick="addModule('content-new');" data-toggle="tooltip" title="{{ button_module_add }}" class="btn btn-primary btn-sm"><i class="fa fa-plus-circle"></i></button>
          </div>
        </div></td>
    </tr>
  </tfoot>
</table>

创建以下文件:

catalog/controller/common/content_new.php

内容:

<?php
class ControllerCommonContentNew extends Controller {
    public function index() {
        $this->load->model('design/layout');
        if (isset($this->request->get['route'])) {
            $route = (string)$this->request->get['route'];
        } else {
            $route = 'common/home';
        }
        $layout_id = 0;
        if ($route == 'product/category' && isset($this->request->get['path'])) {
            $this->load->model('catalog/category');
            $path = explode('_', (string)$this->request->get['path']);
            $layout_id = $this->model_catalog_category->getCategoryLayoutId(end($path));
        }
        if ($route == 'product/product' && isset($this->request->get['product_id'])) {
            $this->load->model('catalog/product');
            $layout_id = $this->model_catalog_product->getProductLayoutId($this->request->get['product_id']);
        }
        if ($route == 'information/information' && isset($this->request->get['information_id'])) {
            $this->load->model('catalog/information');
            $layout_id = $this->model_catalog_information->getInformationLayoutId($this->request->get['information_id']);
        }
        if (!$layout_id) {
            $layout_id = $this->model_design_layout->getLayout($route);
        }
        if (!$layout_id) {
            $layout_id = $this->config->get('config_layout_id');
        }
        $this->load->model('setting/module');
        $data['modules'] = array();
        $modules = $this->model_design_layout->getLayoutModules($layout_id, 'content_new');
        foreach ($modules as $module) {
            $part = explode('.', $module['code']);
            if (isset($part[0]) && $this->config->get('module_' . $part[0] . '_status')) {
                $module_data = $this->load->controller('extension/module/' . $part[0]);
                if ($module_data) {
                    $data['modules'][] = $module_data;
                }
            }
            if (isset($part[1])) {
                $setting_info = $this->model_setting_module->getModule($part[1]);
                if ($setting_info && $setting_info['status']) {
                    $output = $this->load->controller('extension/module/' . $part[0], $setting_info);
                    if ($output) {
                        $data['modules'][] = $output;
                    }
                }
            }
        }
        return $this->load->view('common/content_new', $data);
    }
}

创建以下文件:

catalog/view/theme/default/template/common/content_new.twig

内容:

{% for module in modules %}
{{ module }}
{% endfor %}

文件:

catalog/controller/common/home.php

查找:

$data['content_top'] = $this->load->controller('common/content_top');

在它之前添加:

$data['content_new'] = $this->load->controller('common/content_new');

文件:

catalog/view/theme/default/template/common/home.twig

查找:

{{ header }}

在其后添加:

{{ content_new }}