跳到主要內容

將Google行事曆崁入Xoops自訂區塊及共用設定教學-教學撰寫:徐嘉裕Neil hsu

Google行事曆是一個非常好用的功能,當設定的事件觸發時,除了Chrome瀏覽器會發出通知外,如果手機是Android系統,則手機也會發出提示響聲,也能在手機的app軟體日曆上直接編寫事件內容,並且有支援iframe程式碼可以吧行事曆崁入在Xoops網站的自訂區塊中,像是以下的呈現方式:


範例網站:http://163.30.85.10/

而且除了顯示官網行事曆事件外,還能吧其他會員的行事曆也一起加入到官網行事曆中,就像g+的相互關注功能一樣,只又雙方互設公開跟加入對方帳號,就能在雙方的行事曆上顯示對方的事件內容。





設定方法如下:

1、先進入Google行事曆中 網址:https://calendar.google.com  使用Google帳號登入。

2、找到左邊的我的日曆,點選日曆右邊有一個三角形箭頭,點選後會有選單,選擇【共用此日曆】







3、進入設定頁面中,吧【與其他人共用此日曆】給勾選起來




備註說明:如果公開日曆只能顯示【看見是否有空】而無法選擇事件,請進入Goople管理控制台:
https://admin.google.com

A、在管理控制台資訊主頁中,依序前往 [應用程式][G Suite][日曆]。
B、選擇日曆->按一下 [變更分享設定]。


這樣就能變更日曆為顯示事件狀態

如果是公家機關用的G Suite帳號所開設的子帳號,請用最高管理權限那組G Suite帳號帳號->應用程式->[G Suite]->日曆設定中修改共用設定:改為【分享所有資訊】這樣G Suite底下的子帳號才能使用公開日曆的【查看所有活動詳情資訊】功能。






4、在下方的【與特定使用者共用日曆】中輸入要顯示在官網行事曆中的會員帳號,例如要顯示b168168tw@gmail.com的行事曆在官網行事曆中,則填入對方的GMAIL帳號,完成後點選儲存。

5、如果要吧b168168tw@gmail.com刪除不顯示在官網行事曆中,按照說明2的方法進到【共用此日曆】,然後找到【與特定使用者共用日曆】,找到要刪除的帳號,點選右邊的垃圾桶後儲存即可刪除,被刪除的帳號的行事曆事件將不會顯示在官網行事曆中。


6、(很重要)被加入行事曆會員的帳號必須設為公開才行,否則官網行事曆會出現沒有檢視日曆的權限如下圖,所以必須還要通知被加入行事曆的會員按照說明3操作設為公開行事曆才行,這樣事件才會顯示在官網行事曆上。





7、接下來就是設定要崁入Xoops自訂區塊的部分了,需要取得行事曆的iframe程式碼,請點選上方的返回日曆



8、回到日曆首頁後,點選我的日曆->選擇日曆->點選右邊的箭頭會跳出選單->選擇【日曆設定】





9、進到日曆設定後,找到崁入此日曆->找到右邊的【自訂顏色、大小與其他選項】點選進入。





10、可以設定要崁入的行事曆大小,不能太大會拉破網站版面,太小又不好看有空白,可以自行調整最適大小。





11、很重要,吧要顯示在官網行事曆中的會員行事曆及假期行事曆官網行事曆勾選起來。




其中的Contacts選項千萬不要勾,這個功能主要是顯示通訊錄中會員生日訊息,但因IE瀏覽器不支援其中的JS或CSS設定,如果勾了崁入的行事曆介面會醜得跟狗啃的一樣,功能也會異常,只能在Google Chrome瀏覽器中才能正常顯示內容,所以千萬不要勾選Contacts選項(如果您不介意IE瀏覽器的介面呈現勾起來是沒差)。


12、接者點選上方的更新HTML按鈕,然後吧下方文字框中程式碼全部的CODE複製起來




13、進到您的Xoops網站管理後台->選擇模組->系統管理->區塊



14、點選右邊的新增區塊按鈕





15、按照以下A.B.C進行區塊設定



A:設為啟用(這樣區塊才會顯示在頁面上)
B:填入區塊標題
C:吧剛剛複製的行事曆程式碼貼入內容框中。

然後選擇下方的送出。

這樣就完成吧Google行事曆崁入Xoops自訂區塊的操作了,去前台看一下行事曆是否有呈現。

如果設定正確官網的事件跟會員的事件都會出現在官網行事曆中!!



如果之後有要新增其他的會員近來官網行事曆中,或是要刪除目前的行事曆群組中的會員,請重複【說明4到說明15的操作】,包括崁入的程式碼及Xoops的行事曆區塊程式碼都要覆蓋更新才行。

如果要管理官網行事曆或是會員要管理自己的行事曆,最快的方法就是點選官網行事曆下方的Google日曆按鈕,就能進到行事曆的管理介面中了。





教學撰寫: 徐嘉裕 Neil hsu

留言

這個網誌中的熱門文章

好用的windows備份檔案dos指令XCOPY-教學撰寫:徐嘉裕Neil hsu

要快速的備份某個硬碟全部資料到備份硬碟中,雖然是可以用windows內建的備份與還原,但如果重灌windows可會有key不同而無法還原的問題,還要改一堆設定煩死了,直接用dos指令XCOPY來做檔案的複製就很快了,資料也不會丟失,好朋友可以參考看看!! 首先開啟windows所有程式->附屬應用程式->開啟命令提示字元! 然後輸入以下指令 XCOPY C:\xxx   F:\xxx /s 藍字的 C:\xxx  為複製檔案來源位置例如要複製整個C槽就輸入 C:\ 綠色的   F:\xxx 為複製目的位置,例如要放到F槽的備份資料夾,就輸入  F:\ 備份 紅字的 S 為複製類型參數,可以自行修改為以下的參數設定: ================================================================= /A    只複製設定成保存屬性的檔案,不要改變屬性的設定。 /M    只複製設定成保存屬性的檔案,並清除保存屬性。 /D:m-d-y  複製指定日期當天或之後變更的檔案。如果沒給日期,只複製那些來源檔案日期比目的檔案日期為新的檔案。 /EXCLUDE:file1[+file2][+file3]...         指定檔案清單字串。每個字串應在不同行。如果有字串對應到要進行複製的檔案絕         對路徑的任何部分,這個檔案會被排除複製。例如,指定字串         \obj\ 或 .obj 的話,會排除所有在 obj 目錄下副檔名是.obj 的檔案複製。 /P    在建立每個目的檔案時顯示提示。 /S    複製每個目錄及其包含的子目錄,不複製空目錄。 /E    複製每個目錄及其包含的子目錄,也複製空目錄。/S 與 /E相同,能夠用來修改 /T。 /V   ...

jQuery取得下拉選單selected中數值與內容的方法

假設選單狀態為: <select id='selectname '> <option value='v1' data-id="d1">選單A</option> <option value='v2' data-id="d2">選單B</option> <option value='v3' data-id="d3">選單C</option> </select> 以jQuery取得選單數值與內容方法如下: 1、取得下拉選單 value 數值的方法 $selectname=$('#selectname').val(); alert($selectname); //顯示選單中 selected 狀態的value數值v1 or  v2  or  v3。 2、取得下拉選單中 data-id 數值的方法 $data-id= $(this).find(':selected').attr('data-id'); alert($data-id); //顯示選單中 selected 狀態的data-id數值d1 or  d2 or  d3。 3、取得下拉選單中 文字 的方法 $selecttext=$(this).find(':selected').text(); alert($selecttext); //顯示選單中 selected 狀態的文字內容,如選單A or  選單B or 選單C。 教學撰寫:徐嘉裕 Neil hsu

PhpSpreadsheet電子表格PHP匯出excel排版範例->Xoops-教學撰寫:徐嘉裕Neil hsu

在開發模組時如果要吧資料表內容匯出excel,最常用的套件因該就是PHPExcel,但是官網已經說明PHPExcel套件因升級不易只能支援到php5.6, 該物件已於2017年正式棄用,並於2019年永久歸檔 ,換句話說PHPExcel套件對於日後新版的excel格式均不支援,為保持程式在最新狀態只好棄用PHPExcel改使用PhpSpreadsheet電子表格套件,該套件也是能匯出excel,還能匯出LibreOffice Calc,感覺還不錯! 唯一比較麻煩的是使用PhpSpreadsheet要先佈署composer,如果沒佈署composer是沒辦法使用的,還好官方有釋出已經設定好的phpoffice套件可以直接引入使用,省了很多麻煩,使用PhpSpreadsheet方法如下: 1、先下載PhpSpreadsheet套件,我已經幫大家吧phpoffice一起打包上傳 https://drive.google.com/file/d/1jw73diWVjbcr1ycY-gtqM2cGfpLp1zS_/view?usp=sharing 下載回來後解壓縮吧phpoffice跟PhpSpreadsheet丟到Xoops模組的class資料夾中,未來如需更新PhpSpreadsheet可到官網下載最新版覆蓋即可 https://github.com/PHPOffice/PhpSpreadsheet 2、然後建立一個excel.php放在模組根目錄中 以下為編排excel表格常用的函數設定 include_once "header.php"; //先引入autoload.php檔 include_once XOOPS_ROOT_PATH.'/modules/ 模組ID /class/phpoffice/vendor/autoload.php'; use PhpOffice\PhpSpreadsheet\Spreadsheet; use PhpOffice\PhpSpreadsheet\IOFactory; $spreadsheet = new Spreadsheet(); //實體化Excel工作表 //設置電子表格元數據的操作: $spreadsheet->getProperties() ->setCreator...