WordPressバックエンドの画像アップロード機能のサンプル解説、WordPressサンプル解説_PHPチュートリアル

WordPressバックエンドの画像アップロード機能の事例解説、WordPress事例解説

画像アップロード

ファイルの準備: 新しい php ファイルを作成します。テストにはデフォルトのテーマ Twenty Ten を使用しました。まず、このテーマのフォルダーに新しいファイル -myfunctions.php を作成し、functions.php ファイルを開き、次のコードを追加します。一番下にある新しいファイルをロードします:

クラスのコードは次のとおりです:

後で背景設定ページを確認し、追加後のレンダリングを確認してください:

この時点で、テキストフィールドとアップロードボタンはすでに存在しますが、クリックしてもまだ効果はありません。クリック後にアップロードフレームをポップアップさせるには、jsコードも追加する必要があります。

管理を容易にするために、新しい js ファイルを作成し、twentyten テーマ フォルダーの下に新しいフォルダー js を作成し、このファイルの下に新しい Upload.js ファイルを追加します。 jsコードを追加:

次のステップは、js と css をロードすることです。
上記のクラスの display() 関数に次のコードを追加します。

後で背景設定ページのソースコードを表示すると、ソースコードのほぼ最後に読み込んだ js ファイルが表示されます。

さて、今から試してみましょう:

複数の画像アップロードフォーム
まずフォームを変更し、複数のアップロードボタンを追加し、画像を表示するための div コンテナを追加します。
上記のチュートリアルの JS コードは、テキスト フィールドの ID 値を通じて要素を取得しますが、HTML ドキュメント内で ID を同じにすることはできません。その場合、それぞれに対して JS を記述する必要があります。 form. 、これは非常に面倒なので、今日はフォームを変更し、クラスを通じてオブジェクトを取得するように js を変更します。

クラス内のdisplay()関数を次のように変更します(新しいashu_ico項目を追加し、アップロードボタンのid属性を削除してclass="ashu_bottom"に変更しました):

ここには新しい設定項目が追加されています。以前のデフォルトのデータ設定とデータの更新には、対応する追加が必要です。非常に簡単なので、ここでは詳しく説明しません。

新しい js コードを見てみましょう。エディタで Upload.js を開き、コードを次のように変更します。 リーリー

Wordpress ThickBox 画像をクリックすると次の画像の修正方法が表示されます
• WordPressのバックエンドにトップレベルメニューとサブメニューを追加する機能を詳しく解説
• カスタマイズされたバックエンド管理WordPress のインターフェイスの配色 ヒント
• WordPress 編集の背景にプロンプ​​トボックスを追加するためのコード例を共有する
• WordPress の記事にカスタムフィールドと背景編集機能領域を追加する
• いくつかの実践的な WordPress バックグラウンド MySQL 操作コマンドをまとめました