সম্পাদক শৈলী এবং টাইপকিট

Question

আমার ওয়েবসাইট কাস্টম ফন্টগুলি ধরতে টাইপিকিট ব্যবহার করে, যা সীমান্তে কাজ করে।

আমি এটি আমার সম্পাদক শৈলীতে ব্যাকএন্ডে রাখতে চাই। তবে আমি কীভাবে এটি করব তা আমি জানি না। টাইপকিট সিএসএস ফন্ট-ফেস এম্বেড স্নিপেটের পরিবর্তে একটি জেএস এম্বেড স্নিপেট ব্যবহার করে।

Comments

পরামর্শ দিন এটি স্ট্যাকওভারফ্লোতে স্থানান্তরিত হয়েছে - এটি আসলে কোনও ডাব্লুপি সমস্যা নয়।

— আনু

এটি কারণ আমি সাধারণ ক্ষেত্রে টাইপিকিট করতে জানি। আমি যা করার চেষ্টা করছি তা এটিকে ওয়ার্ডপ্রেস সম্পাদক এ intoুকিয়ে দেওয়া। যদি এটি স্ট্যাক ওভারফ্লোতে স্থানান্তরিত হয় তবে লোকেরা কেবল "এইচএমএমএম" যাচ্ছেন তবে এটি একটি ওয়ার্ডপ্রেস প্রশ্ন = গুলি "

— টম জে নওয়েল

Answer 1

টম নওলের টিনিএমসিই প্লাগইন সমাধানটি দুর্দান্তভাবে কাজ করে, টাইপিকিটের নতুন অ্যাসিঙ্ক কোডটি ব্যবহার করার জন্য কেবল জাভাস্ক্রিপ্ট আপডেট করুন । আপনি একবার নতুন অ্যাসিঙ্ক এম্বেড কোডটি ব্যবহার করার পরে, 403 সমস্যাটি অদৃশ্য হয়ে যাবে এবং আপনার টাইপকিট-সক্ষমিত টিনিএমসিই কোনও গোলযোগ নেই!

টম সমস্ত কোড এক ব্লগ পোস্টে একসাথে রেখেছেন। তিনি এটিতে সমস্ত ভারী উত্তোলন করেছিলেন, তাই তাকে কিছু পৃষ্ঠাভিউ দিন এবং সেখানের বিশদটি পড়ুন !

Comments

এটা করে? (আমি উভয়কে জিজ্ঞাসা করেছি এবং উত্তর দিয়েছি = পি) আমার সমাধানটি সুরক্ষার জন্য না হলে কাজ করবে, যদি আমি একই ডোমেনের কাজ করে যদি ইফ্রামের সিআরসি একটি ফাঁকা পৃষ্ঠায় সেট করতে পারি তবে আমি নতুন অ্যাসিঙ্ক কোডটি পরীক্ষা করব যদিও!

— টম জে নোয়েল

আচ্ছা হুজ্জাহ এটা করে !! =]

— টম জে নওয়েল

আপনি কেবলমাত্র সম্পূর্ণতার জন্য আমার কোডটির আপডেট হওয়া সংস্করণ দিয়ে আপনার উত্তরটি পরিবর্তন করতে পারেন?

— টম জে নওয়েল

আমি এখানে একটি ব্লগপোস্ট লিখেছি: tomjn.com/150/typekit-wp-editor- শিরোনামের কোড সহ স্টাইলস , আপনার কি একটি টুইটার অ্যাকাউন্ট আছে যা আমি আপনাকে async বিট বের করার জন্য ক্রেডিট করতে পারি?

— টম জে নওয়েল

আমি আপনার ব্লগ পোস্টে লিঙ্ক আমার উত্তর আপডেট করব। আপনি এখানে ভারী উত্তোলন করেছেন!

— ক্রিস ভ্যান প্যাটেন

Answer 2

আমি একটি টিনেমেস প্লাগইন যোগ করে এটি পেয়েছিলাম, এটি প্রায় আছে তবে আমি টাইপকিট থেকে ফন্ট সিএসএস পুনরুদ্ধার করার চেষ্টা করলে 403 বারণ করা হচ্ছে:

JS:

(function() {
    tinymce.create('tinymce.plugins.typekit', {
        init: function(ed, url) {
            ed.onPreInit.add(function(ed) {

                // Get the DOM document object for the IFRAME
                var doc = ed.getDoc();

                // Create the script we will add to the header asynchronously
                var jscript = "var TypekitConfig = {\n\
                    kitId: '*******'\n\
                    };\n\
                    (function() {\n\
                    var tk = document.createElement('script');\n\
                    tk.src = '//use.typekit.com/' + TypekitConfig.kitId + '.js';\n\
                    tk.type = 'text/javascript';\n\
                    tk.async = 'true';\n\
                    tk.onload = tk.onreadystatechange = function() {\n\
                    var rs = this.readyState;\n\
                    if (rs && rs != 'complete' && rs != 'loaded') return;\n\
                    try { Typekit.load(TypekitConfig); } catch (e) {}\n\
                    };\n\
                    var s = document.getElementsByTagName('script')[0];\n\
                    s.parentNode.insertBefore(tk, s);\n\
                })();";

                // Create a script element and insert the TypeKit code into it
                var script = doc.createElement("script");
                script.type = "text/javascript";
                script.appendChild(doc.createTextNode(jscript));

                // Add the script to the header
                doc.getElementsByTagName('head')[0].appendChild(script);

            });

        },
        getInfo: function() {
            return {
                longname: 'TypeKit For TinyMCE',
                author: 'Tom J Nowell',
                authorurl: 'http://tomjn.com/',
                infourl: 'http://twitter.com/tarendai',
                version: "1.0"
            };
        }
    });
    tinymce.PluginManager.add('typekit', tinymce.plugins.typekit);
})();

পিএইচপি

add_filter("mce_external_plugins", "tomjn_mce_external_plugins");
function tomjn_mce_external_plugins($plugin_array){
    $plugin_array['typekit']  =  get_template_directory_uri().'/typekit.tinymce.js';
    return $plugin_array;
}

Comments

এটি পুরোপুরি আমার পক্ষে কাজ করেছিল। এর জন্য কিছুটা কাজ এবং ধৈর্য প্রয়োজন তবে এটি সত্যই ভাল কাজ করে!

— racl101

Answer 3

আপনি অ্যাডমিনের জন্য স্ক্রিপ্ট সজ্জিত করতে পারেন তবে এটি আপনার Editor.css এর জন্য পাওয়া উচিত

    add_action( 'admin_print_scripts', 'admin_typekit' );
    function admin_typekit( ) {
         global $pagenow;
         $arg = array( 'post.php', 'post-new.php', 'page-new.php', 'page.php' );
         if ( ! in_array( $pagenow, $arg ))
                return; ?>

          <script type="text/javascript">
              (function () {
                 var config = {
               kitId:'xxxxxx',
               scriptTimeout:3000
               };
               var h = document.getElementsByTagName("html")[0];
               h.className += " wf-loading";
               var t = setTimeout(function () {
               h.className = h.className.replace(/( |^)wf-loading( |$)/g, "");
               h.className += " wf-inactive"
               }, config.scriptTimeout);
               var tk = document.createElement("script");
               tk.src = '//use.typekit.net/' + config.kitId + '.js';
               tk.type = "text/javascript";
               tk.async = "true";
               tk.onload = tk.onreadystatechange = function () {
           var a = this.readyState;
            if (a && a != "complete" && a != "loaded")return;
               clearTimeout(t);
                try {
                  Typekit.load(config)
                } catch (b) { } };
                var s = document.getElementsByTagName("script")[0];
                s.parentNode.insertBefore(tk, s)
             })();
             </script>

   <?php }

সম্পাদনা:

টাইপকিটের জন্য উপরের কোডটি আপডেট করেছে কারণ এতে আপনার উল্লেখ করা মতো কিছু ইনলাইন জেএস প্রয়োজন। অ্যাডমিন_এনকুই_স্ক্রিপ্ট ব্যবহার না করায় আমাদের We হুক ভেরিয়েবলটি $ পেজনোতেও পরিবর্তন করতে হবে।

Comments

এটির মতো সহজ নয়, এটি ইনলাইন স্ক্রিপ্ট, তবে এটি যদি অ্যাডমিনে যোগ করা CSS এর বাছাইয়ের পক্ষে যথেষ্ট হয় তবে এটি কাজ করা উচিত =]

— টম জে নওয়েল

এটি আসলে কাজ করে না। অনুপস্থিত সেমিকোলন এবং একটি বন্ধনী বন্ধনী ছাড়াও, এটি একবার ঠিক করে এটিকে পোস্ট সম্পাদনা পর্দায় ফন্ট যুক্ত করে, আমি ওয়ার্ডপ্রেস ইউআই পরিবর্তন করতে পারি, তবে আমি সম্পাদনা শৈলীতে ফন্টটি ব্যবহার করতে পারি না। আমার পোস্টের সামগ্রীগুলি টাইপকিট ফন্টগুলি ব্যবহার করতে অস্বীকার করেছে এবং এর পরিবর্তে পরবর্তী ফ্যালব্যাক ফন্টগুলি যে কোনও ক্ষেত্রে প্রদর্শিত হবে।

— টম জে নোয়েল

জেএসের নিজেই এটি আইফ্রেমে টেনিএমসিই ব্যবহারের জন্য সন্নিবেশ করা প্রয়োজন, ওয়ার্ডপ্রেস পোস্ট ইউআই লোড করে এমন প্যারেন্ট ফ্রেম নয়

— টম জে নওয়েল

আমি আমার সম্পাদক-স্টাইল। এটি একটি দুর্দান্ত হ্যাকিশ ফিক্স তবে এটি কাজ করেছিল, আমি সমস্ত কিছু চেষ্টা করার পরে।

— কোল