widget - Google Blogger/ Blogspot 并创建自定义容器以将小工具小部件添加到布局页面

Question

我是 Blogger.com 界面和使用此平台自定义模板的新手。Blogger 使用熟悉的 XML 进行编码，但我无法在 Blogger 中找出正确的编码来放置可在 Blogger 的布局页面中访问的自定义容器。我想创建它尽可能用户友好。

当我尝试保存模板时，我尝试过的所有操作都会出错。我只需要朝着正确的方向普遍推动。

Answer 1

将此代码放在要放置容器的部分的“正文”下方：

     <b:section class='type-of-widget-here-main-sidebar-etc' id='custom-id-for-styling' preferred='yes'/>

然后在“/b:skin”位置上方：

    #custom-id-for-styling  {
width: 100%;
margin-left: auto;
margin-right: auto;
padding:0px;
}

将 2 个容器并排放置：

    <b:section class='new-sidebar' id='magazine-left' showaddelement='yes'/>
<b:section class='new-sidebar' id='magazine-right' showaddelement='yes'/>
<div style='clear: both;'/>

CSS：

     #magazine-left {
width: 45%;
float: left;
}

#magazine-right {
width: 45%;
float: right;
}

在每个容器旁边放置 3 个容器：

    <b:section class='main' id='container-left' showaddelement='yes'/>
<b:section class='main' id='container-middle' showaddelement='yes'/>
<b:section class='main' id='container-right' showaddelement='yes'/>
<div style='clear: both;'/>

CSS：

    #container-left {
width: 31.3%;
float: left;
margin-left: auto;
margin-right: auto;
padding:0px;
}

#container-middle {
width: 31.3%;
float: left;
margin-left: auto;
margin-right: auto;
padding:0px;
left:0px;
right:0px;
}

#container-right {
width: 31.3%;
float: right;
margin-left: auto;
margin-right: auto;
padding:0px;
}