October CMS - 快速入門 9 Images And Galleries

dadong 發布于2019-07-01 10:09 / 1659人閱讀

摘要：關系，用于將圖片附加到表上再次刷新頁面，現在可以進行圖片上傳了。如何顯示上傳的圖片簡介查看視頻頁面會出現上面圖片顯示的信息，圖片并沒有顯示出來。我們要是顯示這些圖片，則在進行代碼修改圖集當然我們可以使用插件進行顯示和展示。

這一部分我們將為影片創建圖片和圖片庫
首先我們將分頁改為每頁10個影片

設置圖片

下面，我們將設置圖片，點擊菜單【builder】選擇【Movies】選擇【Models】選擇【Forms】中的fields.yaml
添加一個上傳表單，而且我們不需要為此創建數據庫字段，October會自動處理

現在我們點擊【視頻】菜單，選擇一個視頻編輯

會出現如下錯誤說明沒有定義poster

我們需要在代碼編輯器中，修改文件：pluginsraiseinfomoviesmodelsMovie.php

為poster添加一個關系，關聯到系統的圖片表，把圖片附加到視頻表上。

    /**
     * 關系，用于將圖片附加到Movies表上
     */
    public $attachOne = [
        "poster" => "SystemModelsFile"
    ];

再次刷新頁面，現在可以進行圖片上傳了。

如何顯示上傳的圖片：
themesraiseinfopagesmovie-single.htm

{{ record.poster }}

{% if record %}

{{ record.name }}

{{ record.poster }}

{{ record.year }}

簡介


    {{ record.description|raw }}


{% else %}
    {{ notFoundMessage }}
{% endif %}

查看視頻頁面：http://octobermovie.dev.raise...

會出現上面圖片顯示的信息，圖片并沒有顯示出來。

如果我們使用{{ record.poster.path }}
則顯示圖片地址，到這里，你或許就明白了，我們需要構建一個img標簽，把這個地址作為img的標簽屬性即可。

再次刷新：

但是，我們發現圖片太大了。好的，我們可以繼續設置。

再比如：對圖像進行200x200的裁剪

設置畫廊

我們將在Models——Movie——Forms——fields.yaml中添加新的字段

接下來，如果我們保存后，去編輯視頻，則還會出現錯誤

那么和原來一樣，我們修改插件的Models文件
pluginsraiseinfomoviesmodelsMovie.php

 public $attachMany = [
    "movie_gallery" => "SystemModelsFile"
];

再次刷新：

現在可以上傳多張圖片了

這些圖片可以拖動，調整順序，或者是刪除。

我們要是顯示這些圖片，則在themesraiseinfopagesmovie-single.htm進行代碼修改

圖集

    {% for image in record.movie_gallery %}
        
            
                
            
        
    {% endfor %}

當然我們可以使用js插件進行顯示和展示。

云服務器 GPU云服務器 java 9天快速前端快速入門 Galleries October

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/28857.html

October CMS - 快速入門 17 - 為組件添加選項

摘要：上一節我們通過組件為首頁添加了組件，顯示了演員的列表。但是，我們只是設置了選項，這個選項并沒有對數據進行控制。演員排序對演員排序以姓名升序排列以姓名降序排列好的，現在選項顯示出來。上一節我們通過actor組件為首頁添加了組件，顯示了演員的列表。下面我們將為組件添加一些屬性：defineProperties這個函數會返回一個數組，數組里面的每個數組將返回的是每個選項添加顯示演員個數限...

longmon 2019-07-01 10:11 評論0 收藏0
October CMS - 快速入門 6 基本模板

摘要：本節將編寫一些實現對頁面中內容的控制。將內容放入容器文件添加類，讓輸出的內容在一個容器中。創建菜單編輯點擊菜單此頁沒有頭和尾，是因為我們沒有給這個頁面使用布局再次查看頁面，則顯示正常了為當前頁面菜單添加樣式本節將編寫一些css實現對頁面中內容的控制。將內容放入容器文件：themesraiseinfolayoutsdefault.htm ...

littleGrow 2019-07-01 10:09 評論0 收藏0
October CMS - 快速入門 1 安裝

摘要：項目源碼地址視頻按照開發環境的要求安裝環境，必不可少的是了。在命令行執行上述命令完成后，進入對應的目錄，這里執行根據提示輸入您對應的開發環境參數。項目源碼地址：https://gitee.com/494901823/O... 視頻：http://www.365yg.com/i6567340... 按照laravel開發環境的要求安裝環境，必不可少的是composer了。在命令行執行c...

xcold 2019-07-01 10:08 評論0 收藏0
October CMS - 快速入門 5 創建插件

摘要：創建插件對于來講是很簡單的事情，因為，提供了一個插件構建器具體步驟這里就不贅述了。安裝完成后，會出現上圖所示的菜單創建自己的插件的方法是點擊如下圖所示的小按鈕。創建插件對于October來講是很簡單的事情，因為，October提供了一個插件構建器：RainLab.Builder showImg(https://segmentfault.com/img/bVbcoxL?w=1266&h...

macg0406 2019-07-01 10:09 評論0 收藏0
October CMS - 快速入門 18 - 創建聯系表單

摘要：郵件設置設置為。創建插件打開編輯器，在插件目錄下創建目錄，并在目錄下創建表單文件定義組件增加新頁面查看頁面前端，確認已經生效，只是插件沒有定義，所以沒有內容可以顯示。郵件設置：config/mail.php；設置為smtp。創建插件Contact showImg(https://segmentfault.com/img/bVbctuz?w=940&h=624); 打開編輯器，在co...

jlanglang 2019-07-01 10:11 評論0 收藏0