2

Sitecore の Web Form for Marketers モジュールの送信ボタンを画像付きに変更したいです。

少し早いですがお礼を

4

5 に答える 5

1

送信ボタンを に変更しようとしているようです<input type="image" />。WFFM でこれを行う方法が見つかりませんでした。送信ボタンのスタイルを設定したり、フォームを ASCX にエクスポートして自分で画像を変更したりできます。

のCSSスタイリングでかなりのことができます<input type="submit" />。

http://www.456bereastreet.com/lab/styling-form-controls-revisited/submit-button/

于 2011-07-13T14:08:09.853 に答える
1

ボタンのスタイルは Default.css で変更できます。background-image を使用して画像を追加します。

以下の例では、WFFM の送信ボタンの背景として画像を使用しています。

.scfSubmitButtonBorder
{

    background-image: url(/images/bg_button.png);
    padding-left: 5px;
    float: right;
    margin-bottom: 10px;
}

.scfSubmitButtonBorder input
{

    border: none;
    padding: 0 5px 0 0;
    color: white;
    font: 14px/14px FrutigerRoman, Arial !important;
    width: 100px;
    height: 30px;
    background-image: url(/images/bg_button.png);
    background-position: right -30px;
    background-color: transparent;
    cursor: pointer;
}
于 2012-04-13T08:48:19.153 に答える
0

これが私がやった方法です。

まず、カスタム コントロールを作成します。

namespace Sitecore.Custom.Controls
{
    public class ImageSubmitButton : Sitecore.Form.Web.UI.Controls.SubmitButton
    {
        public string ImageUrl { get; set; }

        protected override void AddAttributesToRender(System.Web.UI.HtmlTextWriter writer)
        {
            if (string.IsNullOrEmpty(ImageUrl) == false)
            {
                writer.AddAttribute("type", "image");
                writer.AddAttribute("src", ResolveUrl(ImageUrl));
            }
            // This won't overwrite our explicit type="image"
            base.AddAttributesToRender(writer);
        }
    }
}

サイトコアでフォームを ASCX としてエクスポートし、デベロッパー センターを使用して新しいサブレイアウトを作成し、エクスポートされた ASCX コードをこのファイルにコピーします。まず、新しいプレフィックスを登録します

<%@ Register TagPrefix="ctrl" Namespace="Sitecore.Custom.Controls" Assembly="<AssemblyName>" %>

最後に、変更

  <cc0:submitbutton runat="server" onclientclick="$scw.webform.lastSubmit = this.id;" text="Submit" validationgroup="..." cssclass="..." id="..." onclick="OnClick" >
  </cc0:submitbutton>

に

<ctrl:ImageSubmitButton ImageUrl="~/imgs/button.png" runat="server" OnClientClick="$scw.webform.lastSubmit = this.id;"
    Text="Submit" validationgroup="..." cssclass="..." id="..."
    OnClick="OnClick"></ctrl:ImageSubmitButton>

最後に、アイテムのフォームをサブレイアウトに置き換えます。

于 2011-09-06T22:41:11.900 に答える
0

Web Forms for Marketers モジュールについて話しているのではないでしょうか? あなたの最初の質問からは明らかではありません...

とにかく、フォーム デザイナーで送信ボタンを選択すると、そのプロパティが左側に表示されます。さまざまなプロパティの中で、一番最初にあるのは "Button Name" という編集ボックスです。送信ボタンに必要なテキストをそこに置きます。

于 2011-07-13T13:04:10.787 に答える