بلاگ

  • اصلاً شورت‌کدها چه هستند؟

    What-Are-Shortcodes-Anywayاگر متوجه شده باشید، یکی از اصول بنیادین وردپرس این است که همیشه، همیشه کارها را برای همه – از افراد مبتدی گرفته تا توسعه‌دهندگان باتجربه – کمی آسان‌تر کند. یکی از روش‌هایی که به این هدف دست می‌یابند، استفاده از کدهای کوتاه (شورت‌کدها) است.

    صفحه پشتیبانی WordPress.com آن‌ها را این‌گونه تعریف می‌کند:

    shtبسیار ساده به نظر می‌رسد. حال، اگر قبل از این مقاله چیزی درباره کدهای کوتاه نشنیده‌اید و نمی‌دانید چه شکلی هستند، آن‌ها همان متن‌های شبه‌کد کهن هستند که درون قلاب‌ها قرار گرفته‌اند.

    در مقایسه با کد معمولی، که معمولاً این شکلی است:

    HTML5-video-tag-sample-code
    (اِ… چی؟)

    کدهای کوتاه به‌طور کلی چیزی شبیه به این هستند:

    embed_shortcode
    (مثل آب خوردن.)

    … و اگر توسعه‌دهنده هستید (یا اصلاً، حتی کسی که حداقل دو بار با کامپیوتر کار کرده است)، احتمالاً موافق خواهید بود که صرف عمل تایپ کردن و کلیک کردن برای انجام یک کار ناچیز می‌تواند بخش زیادی از وقت شما را بگیرد. دقیقاً به همان دلیلی که میانبرهای صفحه‌کلید را داریم، کدهای کوتاه وجود دارند تا کارها را برای همه ما آسان‌تر کنند، تا بتوانیم در زمان صرفه‌جویی کنیم و چیزهای بهتری بسازیم و خلق کنیم؛ آن‌ها از این نظر که دقیقاً همین هدف را دارند، بسیار شبیه کلیدهای میانبر هستند.

    حال بیایید به این کد کوتاه خاص بازگردیم، همان موردی که در بالا آمد:

    embed-shortcode این کد کوتاه خاص embed shortcode (کد کوتاه جاسازی) نام دارد و به‌طور پیش‌فرض در وردپرس تعبیه شده است. این کد ویدیو را از آدرس URL درون محتوای شما جای‌گذاری می‌کند. اگر هم‌اکنون در وردپرس هستید، چنانچه می‌خواهید آن را امتحان کنید، می‌توانید کد کوتاه بالا را در سایت خود کپی و جای‌گذاری کنید.

    با این حال، کدهای کوتاه راه‌حلی بی‌نقص برای صرفه‌جویی در زمان نیستند. در مقاله قبلی‌مان، عمیق‌تر به این موضوع می‌پردازیم که چرا کدهای کوتاه معایب خاص خود را دارند و تیم ساندویچ در حال تدارک چه راهکاری برای برطرف کردن آن‌هاست.

    با این حال فعلاً با خیال راحت با کدهای کوتاه سرگرم شوید و بررسی کنید که چه کارهایی می‌توانند برای شما انجام دهند.

    سایت‌سازی خوش بگذرد!

  • نگاشت شورت‌کد: چگونه PBS از بیش از ۸۰۰ افزونه و ۲٬۰۰۰ شورت‌کد پشتیبانی خواهد کرد

    How-PBS-Supports-800-Plugins-2000-ShortcodesWhen I started getting further into software development and WordPress, I noticed that not a lot of page builders I come across with have that “page builder standard” I was looking for: fast, easy, convenient.

    Page Builder Sandwich, then, was created with the goal of having a builder meet these same standards.

    I wanted- and still want it– to be the best page builder out there, and the best way I could accomplish that, I figured, was to add in features in a way in which page building becomes helpful and accessible to everyone –developers and noobs alike.

    I’d like to note though, that I didn’t simply create PBS with the intent of merely bombarding it with features just for the sake of it.

    I want to add in features that people would want to work with; features that hopefully, would make the experience of page building feel a little bit more like magic.

    در چند هفته گذشته، تیم PBS یک المان نقشه و همچنین یک المان تب‌ها را اضافه کرده است.

    اکنون، برای ما تبدیل به یک روال کاملاً ساده و پیش‌پاافتاده می‌شد اگر فقط به اضافه کردن یک المان جدید در هر چند روز یک‌بار بسنده می‌کردیم.

    But I think it’d be better if we take it to the next level; to take a bigger leap, do something more drastic, something drizzled with a little more awesomesauce.

    And so we came up with an idea: “How about we start supporting 800+ plugins along with their 2000+ shortcodes?!?!”

    I know what you’re thinking: “How the heck can you support that much shortcodes? Is that even possible?”

    Well, the simple answer is yes. Yes it is.

    And we’ve managed to achieve this feat through shortcode mapping.

    What is Shortcode Mapping?

    Shortcode mapping
    Shortcode mapping makes building shortcodes more friendly.

    Put more simply, shortcode mapping is like letting Page Builder Sandwich memorize all the shortcodes available on your site: their names, descriptions, their attributes, and what each of these attributes do.

    مزایای چنین سیستمی بسیار چشمگیر و قابل‌توجه است:

    1.) Since PBS already knows what your shortcodes are, you get to spend less time going through the documentation of each plugin you use, and check how to use their shortcodes.

    2. ) In other words: Say goodbye to the grueling task of manually typing in your shortcodes!

    3.) With shortcode mapping, you can also say goodbye to manually checking post type ID’s. How? PBS can give you a list of all your contact forms through a drop-down list, so instead of looking for ID’s while on admin mode, you can pick from the list we made instead.

    4.) You’ll get to use dropdowns, colorpickers, image uploaders, and even number sliders when adjusting shortcode attributes.

    5.) Overall faster page building time!

    با این حال، نگاشت شورت‌کد موضوع جدیدی نیست و چندین صفحه‌ساز از قبل آن را دارند. اما چه چیزی محصول ما را متمایز می‌کند؟

    نحوه کارکرد نگاشت شورت‌کد در سایر صفحه‌سازها

    Lonely times
    Each person/site does their own shortcode mapping.

    Other page builders have a dedicated admin page for shortcode mapping. You go inside your admin page, and then their admin page. You put in your shortcode, edit a number of text fields, then hit save. Finally, when you go to your page builder editor, the shortcode is now there in element list.

    در این سناریو، بار مسئولیت نگاشت شورت‌کد بر دوش شما یعنی کاربر گذاشته می‌شود. اگر می‌خواهید تمام شورت‌کدهای شما همراه با تمام ویژگی‌ها (و انتخاب‌گرهای رنگ زیبا و موارد دیگر) به طور کامل نگاشت شوند، باید مطمئن شوید که تک‌تک جزئیات هر شورت‌کد را وارد کرده‌اید.

    What’s more, all your mappings only reside on your site. So when the times comes that you need to work on another site, you’ll have to copy your mappings all over again. Additionally, if and when you install a new plugin that has shortcodes, then you’re going to have to map those too.

    نحوه کارکرد نگاشت شورت‌کد در Page Builder Sandwich

    Shortcode mapping is centralized
    Shortcode mappings are shared across all users.

    Unlike the norm, shortcode mapping in Page Builder Sandwich is done on a global scale. The most used and popular plugins are gathered first, and all their shortcode mappings are created and updated in a central area. These will then spread out to all users depending on what they have installed. In other words, PBS studies and reviews all the shortcodes you have, including your activated plugins. Afterwards, it gives you the mapping of basically everything you need.

    این امر مزایای فوق‌العاده زیادی برای ما به همراه دارد:

    1. Maximum coverage. Since we’ll be mapping out the shortcodes of the popular plugins, PBS will be able to support a majority of the shortcodes available on your site.
    2. Constant and frequent additions, updates and corrections. And since it’s in a central area, changes can be made quickly, and can be disseminated to all users.
    3. It basically works like magic. Let’s say you just installed a new plugin. Then you activate it, all mappings for its shortcodes will automatically get sent to you right away.
    4. Gone are the days when you have to personally map shortcodes yourself. PBS will do that for you.
    5. Your site remains lean and fast, and will only contain shortcode mappings that are relevant to you.
    6. Plugin zip size remains small. Even though PBS supports thousands of shortcodes, the plugin file size is still small. Your site and your backups remain small too!

    In case you’re interested in reading into how we made all of this possible,  we actually have a second part to this article in which things might start sounding a little more technical (if that’s your drift).

    در خبرنامه ما ثبت‌نام کنید!

    You can also opt to sign up to our mailing list, which will automatically notify you when we officially release this feature, (you can get future updates from us too, if you want). The shortcode mapping functionality will be out for our customers tentatively on August 12 August 15 2016. Not all shortcodes will be mapped by this time (our estimate is maybe 100 plugins), but mapping will be continuously done and customers will get them as soon as new ones roll out.

    So sign up to our newsletter to get news on shortcode mapping, when we’ll release it, and when we open shortcode mapping to the public! Until then, we hope you enjoy this new feature of ours, and that you have fun exploring it!

  • ۵ نکته ساده برای اینکه وب‌سایت شما زیبا به نظر برسد

    5-Simple-Ways-To-Make-Your-Website-Look-GoodIn general, one thing that most people tend to overlook is today’s demand for functional design and aesthetics. While not all of us may be aware of the extent of just how much it matters, the fact remains that design is a very crucial factor towards success—any kind of success– including your website’s. Yes, your content is an important key towards reeling your audience in, but how your site looks will definitely be a determining factor as well.

    در اینجا چند نکته اساسی درباره کارهایی که می‌توانید برای بهبود طراحی وب‌سایت خود انجام دهید، آورده شده است.

    Add high-quality images

    You want to add the best quality images on your website that reflect your brand style, but if you don’t have a high-resolution camera or the money to pay a photographer, you can get free stock photos from sources like Pexels and Pixabay. Images should pertain directly to the content of your site. Including images is always better than no images at all.

    رنگ‌های مناسب را انتخاب کنید

    booneselections
    Lawrence Boone Selections uses black to add a sense of luxury and value to their website
    juicebox
    Juicebox used this zesty combination for people to get that organic and fresh that the brand represents

    طرح رنگی یک وب‌سایت نقش مهمی در ایجاد لحن و حال‌وهوای مناسب برای برند شما ایفا می‌کند. انتخاب یک رنگ زیبا لزوماً به این معنی نیست که رنگ درستی است. هر رنگ پیام و واکنش متفاوتی را منتقل می‌کند. رنگ‌ها یکی از اولین چیزهایی هستند که بازدیدکنندگان سایت متوجه آن می‌شوند و در واقع می‌توانند بر موفقیت وب‌سایت شما تأثیر بگذارند.

    برای طراحی خود حداکثر دو تا سه رنگ پایه انتخاب کنید. اگر احساس می‌کنید نیاز به افزودن رنگ بیشتری دارید، می‌توانید از ته‌رنگ‌ها و سایه‌های رنگ‌های پایه خود استفاده کنید. در تئوری رنگ، ته‌رنگ ترکیب یک رنگ با سفید است که روشنایی را افزایش می‌دهد، در حالی که سایه ترکیب یک رنگ با سفید است که روشنایی را کاهش می‌دهد.

    Additional Tip: There are great tools such as Adobe Colour CC and Coolors to make picking colors easier.

    از تایپ‌فیس‌های متضاد استفاده کنید

    Font Pairing There are more fonts other than Arial, Georgia and Times New Roman. Google Web Fonts offer a variety of typefaces you can use for free on your site. Just like with choosing colors you can easily over do fonts, so I suggest you do not use more than two typefaces on your website. Most well-designed websites use two typefaces only, one for the headlines and one for the body text.

    جفت کردن دو تایپ‌فیس حتی برای طراحان نیز می‌تواند دشوار باشد. می‌توانید با آزمودن دو فونت مختلف از یک تایپ‌فیس، کار را ساده نگه دارید. اگر تایپ‌فیس دومی ضروری است، گزینه‌ای را انتخاب کنید که تضاد مناسبی با تایپ‌فیس اول شما داشته باشد. معمولاً ترکیب یک فونت سریف و سنس-سریف در کنار هم خوب عمل می‌کند. نکته مهم دیگر این است که تایپ‌فیس‌هایی را انتخاب کنید که با سبک شرکت شما همخوانی داشته باشند. شما می‌توانید زیباترین فونت دنیا را داشته باشید، اما وقتی در زمینه نامناسب استفاده شود، باز هم می‌تواند بسیار بد به نظر برسد.

    با استفاده از فضای سفید، آن را تمیز و خلوت نگه دارید

    Whitespace is one of the easiest and most effective ways to create a visually effective website. Your website should look well organized and clutter free, directing users exactly where they need to go. Make sure elements stand out and are grouped together by using whitespace properly.

    آن را سازگار با موبایل کنید

    People are probably going to visit your site at different times using different devices and screen sizes. While content is important, consistency across devices provides a better user-experience for anyone who visits your site. It makes it easier for users to share and link contents on your website to social media platforms on mobile. On top of that, Google prioritizes responsive websites on search results.

    نکته تکمیلی: استفاده از Page Builder Sandwich در وب‌سایت شما به‌طور خودکار حالت نمایش در موبایل را فعال کرده و آن را با اندازه صفحه موبایل هماهنگ می‌کند.

    نتیجه‌گیری

    به یاد داشته باشید: دست‌کم گرفتن قدرت طراحی یکی از بدترین اشتباهاتی است که می‌توانید هنگام ساخت وب‌سایت خود مرتکب شوید. البته نیازی نیست هنگام طراحی وب‌سایت خود بیش از حد به خود سخت بگیرید، اما در عین حال، صرفاً رعایت این نکات می‌تواند تضمین کند که سایت شما حس عدم رضایت یا ناخوشایندی را از سوی مخاطبان ایجاد نکند.

  • مشکل ناگفته کدهای کوتاه

    The-Unspoken-Problem-of-Shortcodes

    کدهای کوتاه یکی از نقاط اوج وردپرس هستند. کدهای کوتاه پلی میان توسعه‌دهندگان و سازندگان وب‌سایت هستند و به افراد امکان می‌دهند بخش‌های پیچیده‌ای از محتوا را تقریباً در هر جایی که می‌خواهند قرار دهند. سازندگان افزونه‌ها عاشق کدهای کوتاه هستند، چرا که انعطاف‌پذیری بیشتری در نحوه و مکان نمایش محتوای کاربرانشان فراهم می‌کند.

    اگر نمی‌دانید کدهای کوتاه چه هستند و چه شکلی دارند، آن‌ها همان متن‌های شبیه به کد قدیمی هستند که درون قلاب‌ها (براکت‌ها) قرار گرفته‌اند. چیزی شبیه به این هستند:

    این مورد خاص، کد کوتاه embed نام دارد و به‌طور پیش‌فرض در وردپرس تعبیه شده است. این کد مشخص، ویدیوی موجود در نشانی اینترنتی را در محتوای شما جای‌گذاری می‌کند. اگر می‌خواهید آن را امتحان کنید، کافی است کد کوتاه بالا را در سایت خود کپی و جای‌گذاری نمایید.

    پشت صحنه، اتفاقی که می‌افتد این است که وقتی وردپرس در محتوای شما با یک کد کوتاه مواجه می‌شود، آن را پردازش کرده و به چیز دیگری تبدیل می‌کند. در مثال بالا، هر زمان که یک کد کوتاه

    تشخیص داده شود، وردپرس نشانی موجود در کد کوتاه را برداشته و آن را با تعدادی از ارائه‌دهندگان محتوا که دارد بررسی می‌کند. هنگامی که یکی را پیدا کرد، سپس کد مناسب جای‌گذاری iframe را دریافت کرده و به جای آن نمایش می‌دهد.

    پس مشکل کجاست؟ به اندازه کافی ساده به نظر می‌رسد؛ فقط یک متن کوتاه را با براکت وارد می‌کنید و کار تمام است.

    و اینجاست که رابط برنامه‌نویسی کد کوتاه (Shortcode API) وارد می‌شود…

    وفور کدهای کوتاه

    رابط Shortcode API امکان ساخت کدهای کوتاه را برای توسعه‌دهندگان فراهم می‌کند. به همین دلیل، توسعه‌دهندگان می‌توانند کدهای کوتاه اختصاصی خود را درون افزونه‌هایشان اضافه کنند.

    این فوق‌العاده است؛ اکنون تنها با یک قطعه‌کد کوتاه شبیه به کد (از این رو به آن «کد کوتاه» می‌گویند)، کاربران مبتدی و پیشرفته به یک اندازه می‌توانند عملاً هر نوع محتوایی را که می‌خواهند در هر کجا قرار دهند.

    وردپرس به‌طور پیش‌فرض تنها تعداد انگشت‌شماری کد کوتاه دارد. تایپ کردن آن‌ها از حفظ آسان است، چرا که تعدادشان اندک است. اما اگر چند افزونه نصب کنید، تعداد کدهای کوتاه به سرعت به ده‌ها و در برخی موارد به بیش از صد عدد می‌رسد. هر کد کوتاه مجموعه ویژگی‌ها و دستورالعمل‌های خاص خود را برای نحوه استفاده دارد. هر افزونه احتمالاً نوعی مستندات دارد که نحوه کار تمام کدهای کوتاهش را توضیح داده و تمام پارامترهای موجود در هر یک را فهرست می‌کند. اما اگر بخواهید همه کدهای کوتاه و ویژگی‌های آن‌ها را حفظ کنید، دیوانه خواهید شد.

    مشکل این است که هیچ بخش متمرکزی وجود ندارد که در آن بتوانید تمام کدهای کوتاه موجود در سایت خود و نحوه استفاده از آن‌ها را پیدا کنید.

    برخی تلاش می‌کنند این مشکل را حل کنند

    برخی افزونه‌ها تلاش می‌کنند این مشکل را با ارائه تمام کدهای کوتاه خود در یک منوی کشویی با دسترسی آسان حل کنند. سپس با کلیک روی یکی از آن‌ها، کد کوتاه همراه با تمام ویژگی‌های ممکن برای آن درج می‌شود. دیگر نیازی به حفظ کردن آن نیست که نکته بسیار خوبی است.

    Screen-Shot-2016-06-22-at-11.27.09-AM

    برخی فراتر می‌روند و یک فرم پنجره بازشو (پاپ‌آپ) تنظیمات اضافه می‌کنند که دارای چک‌باکس‌ها و انتخاب‌گرهای رنگ برای پر کردن ویژگی‌های کد کوتاه است.

    Screen-Shot-2016-06-22-at-11.28.54-AM

    این راه‌حل تا حدی کار می‌کند. با این حال، هر افزونه تنها کدهای کوتاه خود را فهرست می‌کند. بنابراین اگر هر افزونه فرم انتخاب‌گر کد کوتاه خودش را ایجاد کند، حتماً با موقعیت‌هایی مواجه می‌شوید که چندین انتخاب‌گر کد کوتاه روی صفحه خود دارید (این اتفاق قبلاً برای من افتاده است).

    Screen-Shot-2016-06-22-at-11.22.41-AM

    به عبارت دیگر، هر افزونه کار خودش را می‌کند و راه‌حل اختصاصی‌اش را برای کدهای کوتاه خود پیاده‌سازی می‌نماید. برخی از افزونه‌ها یا یک دکمه جدید در کنار دکمه «افزودن پرونده چندرسانه‌ای» اضافه می‌کنند، یا یک دکمه جدید داخل TinyMCE قرار می‌دهند.

    بنابراین اکنون ممکن است فکر کنید: «چرا کدهای کوتاه افزونه‌های دیگر را هم جمع‌آوری نکنیم و در منوی کشویی / انتخاب‌گر کد کوتاه خود قرار ندهیم؟» خوب، این دقیقاً همان چیزی بود که من فکر می‌کردم. اما گفتنش آسان‌تر از انجام دادنش است. کمی بعد دلیلش را توضیح خواهم داد، اما ابتدا بیایید ببینیم یک راه‌حل ایده‌آل چگونه خواهد بود.

    راه‌حل ایده‌آل

    برنامه عالی این خواهد بود که افزونه‌ای ساخته شود که تمام کدهای کوتاه موجود در سایت شما را جمع‌آوری کند، سپس فهرست آن‌ها را به شما ارائه دهد و همچنین به شما در پر کردن تمام ویژگی‌ها کمک کند. و هر بار که افزونه جدیدی نصب می‌کنید، تمام آن کدهای کوتاه تازه معرفی‌شده نیز به شما نمایش داده شوند.

    یک مکان مرکزی را تصور کنید که تمام کدهای کوتاه شما برای دسترسی آسان در آن قرار می‌گیرند. هر کد کوتاه توضیح می‌دهد که چه کاری انجام می‌دهد و متعلق به کدام افزونه است. سپس برای هر ویژگی موجود، تصور کنید هر کدام دارای یک برچسب، روشی مناسب برای انتخاب مقدار برای آن و یک توضیح باشند. به شما منوهای کشویی، انتخاب‌گرهای رنگ، دکمه‌های رادیویی، کلیدهای تغییر وضعیت و چیزهای دیگر نشان داده خواهد شد.

    چیزی شبیه به این، زندگی ما را به عنوان سازندگان وب‌سایت و تولیدکنندگان محتوا آسان‌تر می‌کند. دیگر نیازی به بررسی مستندات مختلف یا بخش‌های مختلف پیشخوان مدیریت تنها برای کپی کردن یک کد کوتاه تولیدشده برای اسلایدری که می‌خواهید استفاده کنید نخواهد بود.

    نکته قابل توجه

    متأسفانه در حال حاضر انجام چنین کاری بسیار دشوار است. هیچ روش قطعی برای آگاهی از تمام جزئیات یک کد کوتاه وجود ندارد. شما می‌توانید فهرستی از تمام کدهای کوتاه به دست آورید، اما فقط برچسب‌ها/نام‌های واقعی آن‌ها؛ نمی‌توانید هیچ جزئیات بیشتری درباره آن‌ها مانند فهرستی از ویژگی‌ها، کارکرد آن‌ها و انواع آن‌ها (مانند رشته متنی، رنگ یا عدد) به دست آورید. همچنین نمی‌توانید تصویری از توضیحات مربوط به هر ویژگی داشته باشید.

    یک یادداشت برای توسعه‌دهندگان: بله، یک آرگومان سوم که به‌تازگی اضافه شده برای تابع shortcode_atts وجود دارد، اما این یک آرگومان اجباری نیست. بنابراین مگر اینکه همه توسعه‌دهندگان افزونه در جهان آن را پیاده‌سازی کنند، در غیر این صورت ما همچنان راه مطمئنی برای تعیین تمام ویژگی‌های یک کد کوتاه نخواهیم داشت.

    رابط برنامه‌نویسی کد کوتاه (Shortcode API) هیچ امکانی برای افزودن توضیحات کد کوتاه، تعیین نوع ویژگی‌ها یا توضیحات ویژگی‌ها ارائه نمی‌دهد. و تا زمانی که خود وردپرس یک بخش مرکزی برای دسترسی به کدهای کوتاه اضافه نکند، بعید می‌دانم این امکان ایجاد شود.

    نتیجه‌گیری

    در حال حاضر وظیفه سازماندهی کدهای کوتاه بر عهده هر توسعه‌دهنده گذاشته شده است. مگر اینکه روشی متمرکز در داخل وردپرس توسعه یابد، انتظار داشته باشید که همچنان چندین دکمه «افزودن کد کوتاه» را در بخش مدیریت خود مشاهده کنید. اینکه آیا چنین چیزی باید به هسته وردپرس اضافه شود یا خیر، خود بحث بزرگ دیگری است.

    یک راه‌حل جایگزین

    افزونه‌های صفحه‌سازی وجود دارند که این مسئله را به شکل متفاوتی حل می‌کنند. آن‌ها به جای شناسایی برنامه‌نویسی‌شده کدهای کوتاه، نقشه‌بردارهای کد کوتاه دارند که کاربران در آن‌ها می‌توانند هر یک از جزئیات یک کد کوتاه را به صورت دستی وارد کنند. پس از انجام این کار، آن کد کوتاه در صفحه‌ساز در دسترس قرار می‌گیرد. در حالی که  این روش کار می‌کند، اما آن‌ها فقط در سایت خودتان در دسترس هستند.

    ما اینجا در Page Builder Sandwich در حال ساخت چیزی هستیم که امیدواریم بتواند این معضل کد کوتاه را حل کند. برای اطلاع از پیشرفت ما، در خبرنامه زیر عضو شوید.

  • افزودن نقشه‌های شیک به صفحه شما یک تجربه تعاملی است

    Adding-Stylish-Maps-to-your-Page-is-an-Interactive-Experience-2اکنون می‌توانید با استفاده از Page Builder Sandwich نقشه‌ها را در طراحی‌های صفحه خود قرار دهید!

    شاید هیجان‌زده شدن برای نقشه چیز عجیبی به نظر برسد. آدرس اینترنتی نقشه گوگل را برمی‌دارید و آن را جاگذاری می‌کنید. یا شاید یک افزونه نقشه را به‌صورت آنلاین پیدا کرده و یک کد کوتاه قرار می‌دهید. یا شاید صفحه‌ساز دیگر شما در حال حاضر این قابلیت را دارد و هر زمان که بخواهید می‌توانید یکی اضافه کنید. اما دلیل هیجان ما این است که افزودن نقشه را به سطحی کاملاً جدید ارتقا داده‌ایم.

    این یک پیش‌نمایش است:

    روش قدیمی و کسل‌کننده برای افزودن نقشه

    نحوه افزودن نقشه با یک صفحه‌ساز معمولی به این صورت است:

    1. یک المان نقشه جدید را می‌کشید،
    2. عرض و طول جغرافیایی را در فیلدها وارد می‌کنید،
    3. سایر مقادیر مانند ارتفاع نقشه، عرض نقشه را در فیلدها وارد کرده، تیک سبک جاده و غیره را می‌زنید،
    4. پیش‌نمایش را می‌زنید و ظاهر آن را بررسی می‌کنید و تصمیم می‌گیرید که باید چیزی را تغییر دهید تا جذاب‌تر به نظر برسد،
    5. به صفحه‌ساز برمی‌گردید و مقادیر را تغییر می‌دهید، سپس مرحله ۴ بالا را تکرار می‌کنید.

    روش Page Builder Sandwich برای افزودن نقشه

    نقشه‌ها در وب‌سایت‌ها تعاملی هستند – می‌توانید در اطراف حرکت کنید، روی نقشه بزرگ‌نمایی و کوچک‌نمایی کنید. بنابراین با خود فکر کردیم، چرا تمام حدس و گمان‌ها را حذف نکنیم و به افراد اجازه ندهیم که مستقیماً در حین ساخت صفحه خود با نقشه تعامل داشته باشند؟

    نحوه افزودن نقشه با Page Builder Sandwich به این صورت است:

    1. یک المان نقشه اضافه می‌کنید،
    2. عرض و طول جغرافیایی یا آدرسی را که می‌خواهید نقشه روی آن متمرکز شود تایپ می‌کنید،
    3. نقشه را به اطراف جابه‌جا می‌کنید و روی آن بزرگ‌نمایی یا کوچک‌نمایی می‌کنید تا به ظاهر دلخواه خود برسید،
    4. چند رنگ جذاب به نقشه‌های خود اضافه می‌کنید تا با سبک شما هماهنگ شود،
    5. روی ذخیره کلیک می‌کنید.

    روش ما بسیار سرگرم‌کننده‌تر و شهودی‌تر است. شما اساساً همان‌طور با نقشه تعامل می‌کنید که با یک نقشه معمولی گوگل تعامل دارید.

    نقشه‌های رنگی یا سفارشی‌سازی سبک آن‌ها با SnazzyMaps

    یک ویژگی فوق‌العاده که اضافه کرده‌ایم، قابلیت ایجاد تنالیته و رنگ‌آمیزی نقشه‌ها است و انجام آن بسیار آسان است. (این قابلیت فقط مخصوص نسخه پرمیوم است). اگر می‌خواهید به نقشه خود رنگ ببخشید، فقط روی ابزار انتخاب رنگ ما کلیک کرده و رنگی را انتخاب کنید تا نقشه شما بلافاصله تغییر کند.

    این نمونه‌ای است که به رنگ صورتی درآورده‌ایم:

    نرم‌افزار Page Builder Sandwich همچنین از طرح‌های رنگی دقیق‌تر و پیچیده‌تر از طریق SnazzyMaps پشتیبانی می‌کند. آن‌ها لیست عظیمی از طرح‌های رنگی مشارکت‌شده توسط کاربران دارند و اگر کنترل بیشتری روی رنگ‌ها می‌خواهید، به شما امکان می‌دهند طرح اختصاصی خود را بسازید.

    فقط طرح رنگی مورد علاقه خود را پیدا کنید، سپس کد را کپی کرده و در Page Builder Sandwich جای‌گذاری نمایید. طرح رنگ بلافاصله روی نقشه شما اعمال خواهد شد.

    در اینجا یک طرح رنگی جذاب به نام papuportal dark از SnazzyMaps:

    نقشه‌ها را در هر کجایی که دوست دارید قرار دهید

    کارهای بسیار جذاب‌تری وجود دارد که می‌توانید با نقشه‌ها انجام دهید – مانند افزودن آن‌ها در ردیف‌های تمام‌عرض برای ایجاد جلوه‌ای چشمگیرتر. در صورت تمایل می‌توانید آن‌ها را در داخل یک گردونه یا در داخل زبانه‌ها (ویژگی‌ای که به‌زودی اضافه می‌شود) نیز قرار دهید.

    اگر هنوز Page Builder Sandwich را ندارید، می‌توانید با کلیک روی پیوند «دموی زنده» در بالا.

  • ۵ دلیل برای اینکه چرا فضای سفید اهمیت دارد

    Reasons-Why-Whitespace-Mattersدر واقع، فضای سفید (Whitespace) در پایه‌ای‌ترین تعریف خود، همان فضای خالی اطراف و بین تمام عناصر یک ترکیب‌بندی است که علامت‌گذاری‌نشده باقی مانده است. این فضا صرفاً هدر رفتن فضای صفحه نمایش نیست، آن‌طور که اکثر صاحبان وب‌سایت‌ها تصور می‌کنند. در صورت استفاده مناسب، فضاهای سفید در واقع می‌توانند مزایایی برای تبلیغ بهتر یک محصول فراهم کنند. این یک کلید مهم برای خلق طراحی خوب است و وب‌سایت را از هر نظر بهتر می‌کند.

    اگرچه نام «فضای سفید» به این معناست که این فضا سفید است، اما همیشه نباید لزوماً سفید باشد. فضای سفید در واقع می‌تواند هر رنگی باشد—حتی می‌تواند الگو یا بافت ظریفی داشته باشد. این بخشی است که شما نمی‌خواهید چشم روی آن تمرکز کند. از طرفی، به آن فضای منفی

    بنابراین، چرا فضای سفید اهمیت دارد؟

    newsfeed
    منبع تصویر: News Feed

    دلیل شماره ۱: خوانایی را بهبود می‌بخشد

    فضای سفید بین خطوط پایه و پاراگراف‌ها در واقع به افراد کمک می‌کند تا تمامی محتوای سایت را به‌راحتی مطالعه کنند. تنظیم جزئیات کوچک سایت شما (مانند فاصله بین خطوط یا فاصله بین حروف) می‌تواند تفاوت چشمگیری در آسان‌تر کردن مطالعه ایجاد کند.

    هدف این است که با طراحی چیدمان‌هایی که چشم را خسته نمی‌کنند، افراد را به ادامه مطالعه ترغیب کنیم.

    hpmagicwords
    منبع تصویر: HP Magic Words

    دلیل شماره ۲: تعامل را سرعت می‌بخشد

    بیایید صادق باشیم: اکثر بازدیدکنندگان شما هنگام مرور وب‌سایت‌ها، صبر و حوصله کافی برای بررسی دقیق ندارند. وقتی یک وب‌سایت شلوغ و نامرتب به نظر می‌رسد، حواس کاربران را از یافتن آنچه به دنبالش هستند پرت می‌کند.

    فضاهای سفید باید به هدایت بیننده در اطراف صفحه کمک کنند. عناصر کمترِ در حال رقابت برای جلب توجه، به همراه استفاده مناسب از فضاهای سفید، می‌تواند از حواس‌پرتی‌هایی که سرعت بازدیدکنندگان را کُند می‌کند جلوگیری نماید.

    google
    منبع تصویر: Google

    دلیل شماره ۳: جلب توجه به عناصر مناسب

    فضای سفید می‌تواند به کاربران نشانه‌های بصری درباره اینکه باید به کجا نگاه کنند، بدهد. در صورت استفاده صحیح، فضاهای سفید به برجسته‌سازی اطلاعات و جلب توجه به یک بخش خاص در وب‌سایت شما کمک می‌کنند.

    به یاد داشته باشید، اگر همه چیز جلب توجه کند، هیچ‌چیز جلب توجه نخواهد کرد.

    منبع تصویر: Pocket Penguins

    دلیل شماره ۴: برداشت‌های اولیه اهمیت دارند

    ظاهر و حس و حال وب‌سایت، کلید اصلی برای ایجاد یک برداشت اولیه خوب است. برداشت‌های اولیه خوب اغلب منجر به طولانی‌تر شدن مدت زمان بازدید می‌شوند. فضای سفید بیش از حد کم می‌تواند وب‌سایت شما را ارزان‌قیمت و غیرقابل‌اعتماد جلوه دهد. بازدیدکنندگان تا زمانی که سایت جذاب به نظر نرسد، آن یا برندش را معتبر نخواهند دانست. برخورداری از مقدار مناسبی از فضای سفید به ایجاد لحن مناسب برای وب‌سایت شما کمک می‌کند. فضای سفید می‌تواند راهی برای انتقال خلاقیت، طراوت، و گاهی اوقات، ظرافت باشد.

    نکته: در اینجا ایده‌ای درباره چگونگی ایجاد یک طراحی وب ساده و آشنا.

    flockknitwear
    منبع تصویر: Flock Knitwear

    دلیل شماره ۵: به ایجاد فضای تنفس و تعادل کمک می‌کند

    یک طراحی متعادل به معنای متقارن بودن نیست. یک عنصر طراحی بزرگ می‌تواند توسط چند عنصر کوچک‌تر متعادل شود. افزودن فضای سفید راهی عالی برای متعادل کردن عناصر طراحی با اندازه‌های مختلف در صفحه شما است. جریانی ایجاد کنید تا چشمان کاربران به هر سمتی سرگردان نشود. یک طراحی خوب باید بتواند کاربر را از نقطه‌ای به نقطه دیگر بدون سردرگم کردن بازدیدکننده هدایت کند.

    نتیجه‌گیری

    دفعه بعد که از یک وب‌سایت بازدید کردید و متوجه شدید مدتی در آن مانده‌اید، به این فکر کنید که چه چیزی باعث ماندن و مطالعه شما شد. آیا به نظر شما فاصله بین خطوط خواندن مقاله را آسان‌تر کرده است؟ آیا این تجربه باعث می‌شود بخواهید دوباره به آن سر بزنید؟ آیا برای پیدا کردن بخش ناوبری با سختی مواجه شدید؟

    به کاربرد مناسب فضای سفید در وب‌سایت توجه کنید. اگر فکر می‌کنید می‌تواند در وب‌سایت شما نیز مؤثر باشد، یاد بگیرید که چگونه مقدار فضایی را که باید به عنصر خود اختصاص دهید مدیریت و اعمال کنید تا زمانی که احساس کنید بدون فدا کردن «جریان» مورد نظرتان برای وب‌سایت، لحن مناسب و خوانایی را انتقال داده‌اید.

    هدف نهایی هر وب‌سایتی برقراری ارتباط است. جذابیت بصری دوشادوش موفقیت وب‌سایت شما حرکت می‌کند.

  • چرا وردپرس؟

    Why-Wordpressیک نکته مهم که هنگام ساخت اولین وب‌سایت خود باید در نظر بگیرید – چه یک کسب‌وکار باشید، چه یک فریلنسر، یا واقعاً هر چیزی و هر کسی – این است که همه افراد به زبان کدنویسی و توسعه نرم‌افزار مسلط نیستند. به عنوان مثال، شما ممکن است سرآشپزی باشید که می‌خواهد دستور پخت‌های خود را به صورت آنلاین منتشر کند. همچنین ممکن است دانشجوی کارشناسی هنرهای زیبا باشید که به یک پورتفولیوی حرفه‌ای نیاز دارد، یا یک کسب‌وکار نوپا که به سایتی برای خود احتیاج دارد. چه این باشد یا آن یا هر چیزی بین این دو، واقعیت این است که در حالی که برخی از ما ممکن است با اصول اولیه کدنویسی آشنا باشیم، اما همه ما توسعه‌دهنده تمام‌وقت نیستیم و هر کسی که به سایتی نیاز دارد یا آن را می‌خواهد، لزوماً بلد نیست چطور سایتی را از پایه بسازد. اینجاست که وردپرس می‌تواند مفید واقع شود. اکنون این سوال مطرح می‌شود: «چرا وردپرس؟»

    دلیل اول

    وردپرس یک سیستم مدیریت محتوا است و کاملاً کاربرپسند است.

    اولین چیزی که باید بدانید این است که وردپرس یک سیستم مدیریت محتوا (یا CMS) است. به بیان ساده‌تر، این یعنی وردپرس به کاربران خود اجازه می‌دهد وب‌سایت‌ها را بدون نیاز به کدنویسی از پایه ایجاد کنند. وردپرس دارای یک رابط کاربری سیستماتیک و منظم است که به شما امکان می‌دهد بدون نیاز به دستکاری مداوم کدها، همه چیز را تحت کنترل داشته باشید.

    در مقایسه با ساخت یک وب‌سایت از ابتدا، که معمولاً به این صورت شروع می‌شود:

    screenshot-1 با یک سیستم مدیریت محتوا، کار خود را با چیزی شبیه به این آغاز می‌کنید:

    WordPress
    رابط کاربری بک‌اند وردپرس. مدیریت و ایجاد وب‌سایت‌ها با CMS آسان‌تر می‌شود.

    اما شاید از خود بپرسید: «وردپرس عالی به نظر می‌رسد، اما اگر ویژگی‌هایی را که برای سایتم می‌خواهم نداشته باشد چه؟» یا «اگر من یک نقشه، یک پخش‌کننده موسیقی، یک موتور ذخیره‌سازی کش یا یک سیستم امنیتی مطمئن‌تر بخواهم چه؟»

    …از نظر فنی، وردپرس احتمالاً آن ویژگی مورد نظر شما را دارد و در قالب یک افزونه وردپرس.

    دلیل دوم

    افزونه‌ها: گل سرسبد کیک وردپرس

    اگر نگران این هستید که وردپرس آن ویژگی خاصی را که ممکن است برای سایت خود بخواهید نداشته باشد، نگران نباشید: احتمالاً دارد.

    افزونه‌ها «امکانات الحاقی» هستند که برای افزایش کارایی سایت وردپرسی شما وجود دارند. اگر کارآفرینی هستید که برای سایت خود به فرم تماس نیاز دارید، شاید متوجه شوید که خود وردپرس این ویژگی را به تنهایی ندارد، اما افزونه‌های فراوانی وجود دارند که این کار را انجام می‌دهند. و از آنجایی که وردپرس متن‌باز است—به این معنی که تقریباً هر کسی می‌تواند در توسعه آن مشارکت کند—افزونه‌های جدید به طور منظم ساخته می‌شوند. شما می‌توانید فرم تماسی را که می‌خواهید و حتی فراتر از آن را دریافت کنید. شما این آزادی عمل را دارید که افزونه‌های دیگری از دکمه‌های اشتراک‌گذاری اجتماعی گرفته تا نقشه‌ها و حتی تدابیر امنیتی بیشتر برای سایت خود و بسیاری از ویژگی‌ها و افزونه‌های دیگر را اضافه کنید. حالا بگویید آیا این فوق‌العاده نیست؟

    در حال حاضر، وردپرس هزاران افزونه از این دست دارد—و برخی از آن‌ها حتی به صورت رایگان در دسترس هستند و/یا نسخه‌های رایگان دارند، از جمله PBS.

    دلیل سوم

    متن‌باز: جامعه وردپرس

    وردپرس متن‌باز (Open Source) است. این یعنی هر کسی آزاد است در توسعه آن مشارکت کند و هر کسی می‌تواند کدهای زیربنایی آن را بررسی کند تا درباره توسعه نرم‌افزار و حتی خود وردپرس بیشتر بیاموزد. حتی کسب‌وکارهایی وجود دارند که صرفاً به ساخت و توسعه محصولات مرتبط با وردپرس مانند افزونه‌ها و قالب‌ها اختصاص یافته‌اند (مانند ما!)

    از آنجایی که وردپرس متن‌باز است، کاربران، توسعه‌دهندگان و حتی طراحان بی‌شماری وجود دارند که دائماً با یکدیگر همکاری کرده و حتی در حل مشکلات مربوط به وردپرس به یکدیگر کمک می‌کنند. به این ترتیب، شما کمک واقعی را از افراد واقعی دریافت می‌کنید و در عین حال، از یکدیگر یاد می‌گیرید. این چیزی است که خدمات پشتیبانی مشتری معمول شما به ندرت به آن دست پیدا می‌کند.

    دلیل چهارم

    وردپرس معتبر و قانونی است.

    سی‌ان‌ان (CNN)، وبلاگ رسمی جنگ ستارگان، مجله تایم و حتی (باور کنید!) بیانسه، در میان بسیاری دیگر، همگی سایت‌های خود را با وردپرس اجرا می‌کنند. این نام‌های بزرگ نیز تنها چیزی نیستند که بر اعتبار وردپرس صحه می‌گذارند– بر اساس گزارش Treehouse.com، حدود ۲۵ درصد از کل وب‌سایت‌های موجود در وب توسط وردپرس اجرا می‌شوند. با توجه به اینکه چند میلیون و هزاران وب‌سایت وجود دارد… خوب، ۲۵ درصد رقم بسیار بزرگی است.

    دلیل پنجم

    دریایی از قابلیت‌های شخصی‌سازی!

    وردپرس قالب‌های بسیار زیادی برای شما و سایتتان در دسترس دارد. شما آزادید که از میان نسخه‌های رایگان، نسخه‌های تجاری (پرمیوم) انتخاب کنید یا حتی قالبی را خودتان بسازید (یا کسی را استخدام کنید تا آن را برای شما بسازد!).

    دلیل ششم:

    رایگان است.

    بله، درست خواندید. از طریق توسعه محلی (Local Development)، وردپرس کاملاً رایگان است و می‌توانید تنها با کلیک روی یک دکمه آن را روی رایانه خود نصب کنید. به همین ترتیب، به جای استخدام یک توسعه‌دهنده، می‌توانید از هر دانشی که در زمینه کدنویسی دارید برای یادگیری نحوه کارکرد وردپرس استفاده کنید (و البته یادگیری همیشه عالی است).

    …ناگفته نماند که اگر احیاناً فرصت کافی برای غوطه‌ور شدن در وردپرس و ساخت سایت ندارید، همیشه می‌توانید از یک افزونه صفحه‌ساز کارآمد استفاده کرده و افزونه ما را امتحان کنید.

    به یاد داشته باشید که قابلیت‌های وردپرس بی‌پایان هستند و برای درک نحوه عملکرد آن اصلاً نیازی نیست که نابغه باشید!

    استفاده از وردپرس می‌تواند در زمان، هزینه و انرژی شما صرفه‌جویی زیادی کند. و در زمانی که این منابع بسیار محدود هستند، در نظر داشته باشید که سایت‌های وردپرسی، افزونه‌های آنها (مانند PBS!)، پوسته‌ها و به ویژه جامعه کاربری آن، قطعاً می‌توانند به شما کمک کنند و کارها را بسیار بسیار آسان‌تر نمایند.

    ساخت سایت خوش بگذرد!

  • WordPress.com در مقابل WordPress.org

    Wordpress-Com-VS-Wordpress-Orgاگر در زمینه ساخت وب‌سایت نسبتاً تازه‌کار هستید، به احتمال زیاد با بحث داغ و معروف WordPress.com در برابر WordPress.org آشنایی ندارید. شاید حتی نمی‌دانستید که هر دوی این‌ها وجود دارند و هر کدام مزایا و معایب متفاوتی دارند. پس ماجرای این بحث داغ بین استفاده از WordPress.com و WordPress.org واقعاً چیست؟ آیا یکی از آن‌ها صرفاً یک کپی ارزان‌قیمت است که منتظرند از آن شکایت شود؟

    خب، خیر.

    این بحث به طور خلاصه درباره این است که کدام‌یک از این دو سرویس وردپرس برای وب‌سایتی که قصد ساخت آن را دارید مناسب‌تر است. هیچ‌کدام کپی‌برداری از دیگری نیست و هر دو سایت متعلق به وردپرس هستند؛ فقط یکی از آن‌ها (.com) نسخه‌ای مناسب‌تر برای افراد غیربرنامه‌نویس است، و .org در مقایسه با .com، هنگام ساخت سایت محدودیت‌های بسیار کمتری دارد.

    «اما از کجا بفهمم به کدام یک نیاز دارم؟»

    پاسخ به این سؤال کاملاً به نیازهای وب‌سایت آینده شما بستگی دارد. هیچ موجودیت وردپرسی وجود ندارد که از نظر عینی نسخه «بهتر» یا حتی «بهترین» برای استفاده باشد. هر دو دارای ویژگی‌های منحصر‌به‌فرد خود هستند و به میزان مساوی مزایا و معایب دارند.

    WordPress.com: چرا و چه زمانی باید از آن استفاده کنم؟

    WordPress.com به اصول و نیازهای اولیه برای شما رسیدگی می‌کند، که به شما امکان می‌دهد تمرکز بیشتری روی محتوای سایت خود داشته باشید. این یک سایت‌ساز است که به طور کامل توسط گروهی از شرکت‌ها به نام Automattic اداره و میزبانی می‌شود. شما هاستینگ ممتاز، نسخه‌های پشتیبان، امنیت و موارد مشابه را دریافت می‌کنید. این بدان معناست که در مقایسه با گذراندن ساعت‌ها وقت برای ساختن سایت از صفر، می‌توانید بسیار راحت‌تر روی محتوای سایت خود تمرکز کنید.

    با این حال، توجه داشته باشید که WordPress.com نیز با محدودیت‌های خاص خود همراه است. اگرچه ممکن است نیازی نباشد نگران مدیریت بخش‌های فنی داخلی سایت خود باشید، اما باید در نظر داشته باشید که احتمالاً آن‌قدر که مایلید آزادی عمل نخواهید داشت. در حالی که سفارشی‌سازی ظاهر سایت شما ممکن است مشکلی نباشد (برای مثال WordPress.com دارای تعداد زیادی قالب است)، افزودن ویژگی‌ها و عناصر خاص در قالب افزونه‌ها ممکن است به یک مشکل تبدیل شود، به‌ویژه اگر سایت شما به امکانات خاصی نیاز داشته باشد که در WordPress.com در دسترس نیستند.

    نحوه نگهداری یک وب‌سایت یک داستان کاملاً متفاوت است. این موضوع تا حد زیادی بستگی دارد به اینکه ۱) شما توسعه‌دهنده وردپرس نیستید، ۲) قصد یادگیری کدنویسی را ندارید، یا ۳) زمان کم یا هیچ زمانی برای این کار ندارید.

    WordPress.org: چه زمانی وقت در نظر گرفتن آن است؟

    یک قانون کلی در هنگام در نظر گرفتن WordPress.org این است که حداقل کمی با سازوکار کدنویسی آشنا باشید، یا حاضر باشید کمی زمان برای یادگیری آن اختصاص دهید. از آنجایی که WordPress.org یک نسخه خودمیزبان (Self-hosted) از وردپرس است، می‌توانید دست‌به‌کار شوید و هر چقدر که می‌خواهید درگیر جزئیات فنی شوید. به‌علاوه، شما آزادی این را دارید که هر چقدر که مایلید در آن دستکاری و تغییر ایجاد کنید. شما مسئول یافتن هاست خود، راه‌اندازی نسخه‌های پشتیبان امنیتی خود، و به‌طور کلی نگهداری وب‌سایت به دست خودتان – و مهم‌تر از همه، با شرایط و قوانین خودتان – خواهید بود.

    «اما صبر کنید، چرا باید چنین چیزی بخواهم؟ مگر هدف وردپرس آسان‌تر کردن ساخت سایت نیست؟»

    …نه دقیقاً. این‌طور به آن نگاه کنید: The Daily Post یک قیاس عالی بین WordPress.org و WordPress.com ایجاد می‌کند، به گونه‌ای که حتی تازه‌کارترین افراد (مانند خود من) بلافاصله اصل مطلب را متوجه می‌شوند.

    به گفته آن‌ها، باید به WordPress.com به عنوان چیزی نگاه کنید که مالکیت کامل آن را در اختیار ندارید. به عنوان مثال، خودِ ۱۵ ساله‌تان را تصور کنید که هنوز با پدر و مادرتان زندگی می‌کند. اگر می‌خواستید اتاقتان را رنگ کنید، ابتدا باید از والدین خود (که البته مالکیت کامل خانه از جمله اتاق شما را دارند) اجازه می‌گرفتید. از نظر فنی، اتاق مال شماست، اما در نهایت، خب… انگار واقعاً مال شما نیست.

    بنابراین اگر نیاز داشته باشید یا بخواهید تغییرات اساسی ایجاد کنید (مانند رنگ کردن دیوارها، یا بزرگ‌تر کردن اتاق)، باز هم باید با صاحبان واقعی خانه، یعنی مامان و بابا صحبت کنید و/یا مصالحه کنید. با این حال، مزیت این ماجرا این است که وقتی فیوز در زیرزمین می‌سوزد، یا کولر از کار می‌افتد، والدینتان به آن رسیدگی می‌کنند و شما لازم نیست نگران چیزی باشید.

    از سوی دیگر، WordPress.org چیزی است که می‌توانید آزادانه و به میل خودتان آن را سفارشی‌سازی کرده و در آن تغییرات ایجاد کنید. این را می‌توان با زمانی مقایسه کرد که سرانجام در ۱۸ سالگی مستقل می‌شوید و آپارتمان خودتان را می‌گیرید. از آنجایی که شما مالکیت کامل محل سکونت خود را دارید، برای رنگ‌آمیزی دیوارهای خود به آن رنگی که مادرتان همیشه از آن وحشت داشت، نیازی به مصالحه با هیچ‌کس ندارید؛ شما آزادی این را دارید که تصمیم بگیرید و/یا شخصی را که متناسب با معیارهای شماست استخدام کنید تا این کار را برایتان انجام دهد. علاوه بر این، شما همچنین این آزادی را دارید که دقیقاً همان کولری را که می‌خواهید برای اتاق نشیمن خود انتخاب کنید. فقط مسئله این است که اگر خراب شود، باید یک تعمیرکار استخدام کنید تا آن را تعمیر کند، یا خودتان بفهمید مشکل کجاست و چگونه آن را تعمیر کنید (که چندان هم بد نیست، چون به هر حال تجربه می‌شود، و یادگیری چیز خوبی است).

    تا به اینجا، امیدواریم تصویر واضح‌تری از تفاوت‌های آشکار بین WordPress.com و WordPress.org به دست آورده باشید. اما به طور خلاصه:

    هر چقدر که می‌خواهید کم یا زیاد نصب کنید؛ قالب‌ها فقط به قالب‌های وردپرس محدود هستند، برای خلاص شدن از شر تبلیغات باید هزینه مشخصی بپردازید.شما تقریباً کنترل کاملی بر روی سایت خود دارید؛ می‌توانید قالب‌های خود را اضافه، سفارشی‌سازی کرده یا حتی بسازید.

    کنترل محتوا محدود است؛

    WordPress.com WordPress.org
    میزبانی کامل توسط وردپرس؛ تمام نیازهای اساسی تحت پوشش است. خودمیزبان؛ ملزومات خود را انتخاب کنید، یا موارد بهتری را برگزینید.
    ویژگی‌ها به آنچه WordPress.com ارائه می‌دهد محدود است هزاران ویژگی در قالب افزونه‌ها؛

    این‌ها چند مورد از مقایسه‌هایی است که با سنجیدن تفاوت‌های میان این دو حاصل می‌شود. انتخاب بین این دو در نهایت به میزان آزادی عملی که در ساخت سایت خود می‌خواهید، و مقدار منابعی (زمان، تلاش، هزینه و غیره) که حاضر به صرف آن هستید، برمی‌گردد. به یاد داشته باشید که این‌ها هر دو گزینه‌های بسیار حیاتی هستند که قبل از تصمیم‌گیری درباره اینکه کدام پلتفرم وردپرس مناسب‌ترین برای شماست، باید آن‌ها را بسنجید. بنابراین، در فرآیند تصمیم‌گیری عجله نکنید!

    ساخت وب‌سایت خوش بگذرد!

  • ۳ نکته که باید قبل از رفتن به سراغ صفحه‌سازها در نظر بگیرید

    3-Things-to-Consider-Before-Diving-Into-Page-Buildersاحتمال کمی وجود دارد که شما اینجا باشید چون شنیده‌اید که PBS احتمالاً یکی از سریع‌ترین میانبرها برای ساخت سایت است. در حالی که صفحه‌سازها به‌طور کلی برای آسان‌تر کردن کارها وجود دارند، اما هنوز چند نکته وجود دارد که شاید بخواهید قبل از ورود عمیق‌تر به این حوزه خاص از توسعه وردپرس، آن‌ها را در نظر بگیرید.

    یادگیری وردپرس: یک پیش‌نیاز حیاتی برای صفحه‌ساز

    این احتمالاً بدیهی‌ترین مورد در این فهرست است، اما با این حال مهم‌ترین آن‌هاست. متأسفانه صفحه‌سازها به‌تنهایی قابل خریداری نیستند. آن‌ها در قالب افزونه‌هایی در وردپرس ارائه می‌شوند که برای کار با آن‌ها، باید نصبشان کنید و کار با آن‌ها را یاد بگیرید. مطمئن باشید که وردپرس یکی از آسان‌ترین و معتبرترین روش‌ها برای ساخت یک وب‌سایت است. با توجه به عصری که اکنون در آن زندگی می‌کنیم، از یادگیری این نکات فنی پشیمان نخواهید شد. تفاوتی بین WordPress.com و WordPress.org وجود دارد و دانستن اینکه کدام‌یک پاسخگوی نیاز شماست نیز باعث صرفه‌جویی در زمان می‌شود!

    اما اگر فراوانی برخی از اصطلاحات فنی در این مقاله کمی شما را نگران کرده است، نگران نباشید. چند سایت مفید وجود دارد که می‌توانید برای شروع به آن‌ها سر بزنید. برخی از این موارد WordPress Codex و Treehouse هستند. این منابع بسته به نیاز و سطح دانش شما، شامل نکات وردپرس و ساخت وب‌سایت هستند.

    شاید بهتر باشد ابتدا شرایط را بسنجید، فقط برای اینکه مطمئن شوید

    همیشه ایده خوبی است که قبل از انجام هرگونه خرید بزرگ که ممکن است در آینده از آن پشیمان شوید، نسخه‌های رایگان و/یا آزمایشی را امتحان کنید. خوشبختانه، بیشتر صفحه‌سازها دارای نسخه‌های رایگان/دمو هستند. البته، ما همچنین می‌توانیم انبوهی از بررسی‌های معتبر درباره صفحه‌سازها را بررسی کنیم، در حالی که برخی دیگر صفحه‌سازها را با هم مقایسه و ارزیابی می‌کنند.  حتماً گزینه‌های خود را با دقت بسنجید!

    گذشته از مطالعه مقالات و نقدها، یکی از چیزهایی که ما در مورد وردپرس دوست داریم این است که جامعه بزرگی پشت آن قرار دارد. افراد، تیم‌ها و حتی کسب‌وکارهایی وجود دارند که تمایل دارند به دیگر کاربران وردپرس، به‌ویژه افراد تازه‌وارد مانند شما، کمک کنند! این جامعه اساساً بیشتر بر پایه فرهنگ نیکی بدون چشم‌داشت فعالیت می‌کند تا بده‌بستان متقابل.

    طراحی‌ها تفاوت بسیار بزرگی ایجاد می‌کنند

    دونا فونتنوت کاوالیر، از علاقه‌مندان به وردپرس، نکته بسیار خوبی را مطرح می‌کند در مورد صفحه‌سازهای کشیدن و رها کردن و اهمیت طراحی اولیه. در حالی که صفحه‌سازهای کشیدن و رها کردن مانند PBS می‌توانند زمان زیادی را برای شما ذخیره کنند، دانش اولیه و حداقل مقداری آشنایی با زیبایی‌شناسی، نکته مهم دیگری است که باید هنگام ساخت وب‌سایت در نظر گرفت. سناریویی را تصور کنید— فرض کنیم به یک صفحه‌ساز عالی و دلخواه خود دسترسی پیدا کرده‌اید: فوق‌العاده است! اما بعد فرض کنیم شما فردی هستید که دید چندان خوبی در زمینه هنر، طراحی و کاربردپذیری ندارد: ای وای.

    با این حال، نگران نباشید. Page Builder Sandwich صرفاً یک صفحه‌ساز نیست؛ تیم ما همچنین خود را وقف کمک به سایر کاربران وردپرس کرده است. بنابراین اگر در زمینه طراحی با مشکلی مواجه هستید، نگران نباشید— ما مقالات متعددی اینجا در وبلاگ PBS با نکات مفید فراوان داریم تا به شروع شما کمک کنیم. به این ترتیب، کارهای بیشتری انجام می‌دهید، بیشتر یاد می‌گیرید و کمتر نگران خواهید بود.

    به یاد داشته باشید، اگر هرگونه سؤال یا نگرانی در مورد صفحه‌سازها، یا هر موضوع مربوط به موارد بالا دارید، خوشحال می‌شویم در بخش نظرات زیر برای ما پیام بگذارید. ما همیشه از کمک کردن به مشتریان خود خوشحال می‌شویم.

    با آرزوی ساخت وب‌سایت‌هایی عالی!

  • نحوه ایجاد هدرهای هیرو پایه در ۳ مرحله آسان

    How-to-Create-Basic-Hero-Headers-2

    061716_PBS_Jihan_How to Create Basic Hero Headers_Done

    When your dream website finally becomes a reality, the first thing you want your audience to know is what your site’s all about. The trick to reel them in is to give them a good but quick summary of your site’s content – and the easiest way to do that is by creating a Hero Header for your page.

    هدرهای هیرو (Hero Headers) چه هستند؟

    The purpose of the Hero Header is to visually communicate with your target audience in the fastest and most efficient way possible. You need to grab their attention quickly, in a way that it says: “Hey, this is my website, and here are the reasons it may be worth your time.”

    Typically, hero headers take up most of the space on the page, usually with large text and an equally large background image in order to give your readers a quick but firm-enough grasp as to what your website can offer them.

    برای شروع ساخت اولین هدر هیروی PBS خود، مراحل سریع زیر را دنبال کنید:

    مرحله ۱: درج ستون و تنظیم عرض ردیف

    061716_PBS_Jihan_How-to-Create-Basic-Hero-HeadersClick 1 Column below the Insert Content tab on the inspector (that thing on the left/sidebar). Make sure your caret (the blinking cursor on the text box) is inside the text box.

    061716_PBS_Jihan_How to Create Basic Hero Headers_Step-1-b_Revised-1Under the Row Properties tab, you may change the background color in order to use it as a guide for the next steps. Change Row Width from Normal to Full-Width: Retained Content Width using the toggle button shown above.

    What’s the difference between Normal, Full-Width and Full-Width: Retained Content Width?

    Row Width-Normal

    Normal – Background, text and other elements are contained within the bounds of your current theme’s row width

    Row Width-Full-Width

    Full-Width – Background, text and other elements fill the entire width of your browser window

    Row Width-Full-Width Retain

    Full Width: Retained Content Width – Only the background fills the entire width of your browser window. Text and other elements are contained within the bounds of your current theme’s row width

    In this layout, Full Width: Retained Content Width is used because the text that will be applied is centered; not full-width.

    مرحله ۲: تنظیم فاصله بیرونی (مارجین) برای ایجاد فضای خالی

    061716_PBS_Jihan_How to Create Basic Hero Headers_Step-2-revisedIncrease the top and bottom margin by hovering the cursor on the arrow pointing to the margin you want to adjust. When the cursor turns into a double-headed arrow, click and drag down to your desired margin height. Its important to put Whitespace (also called Negative Space) between elements in a composition to create flow and help draw focus to the content on the page.

    مرحله ۳: افزودن پس‌زمینه با متن و لایه‌های رویی عناصر

    061716_PBS_Jihan_How to Create Basic Hero Headers_Step-3-aTo add a background image with text and element overlays, simply click the Background Image icon under the Row Properties tab, upload your desired background image, and select to apply.

    061716_PBS_Jihan_How to Create Basic Hero HeadersTip #1: For Premium users, using the Background Image Tint option, helps to provide more contrast for text, buttons or other elements. You can select a tint color and adjust its value by clicking on the Background Color icon. Both icons can be found under Background on the Row Properties tab.

    061716_PBS_Jihan_How-to-Create-Basic-Hero-Headers_Step-3-cType in the message for your header. See Text Formatting tab to adjust the style. Choose typefaces that are easy to read and goes well with the background image. Remember to show contrast from the background image.

    نکته ۲: برای عناصر برندسازی، استفاده از لوگوی سفید یا مشکی را مد نظر قرار دهید تا با تصویر پس‌زمینه رنگارنگ تداخل نداشته باشد.

    061716_PBS_Jihan_How to Create Basic Hero Headers_Step-3-dYou can also add buttons by clicking on Button below the Insert Content tab.

    فراموش نکنید که کار خود را ذخیره کنید و همه چیز آماده است!

    ساخت اولین هدر هیروی خود با PBS را به شما تبریک می‌گوییم! اگر هم موفق نشدید، نیازی به نگرانی نیست؛ شروع از ابتدا با PBS مسلماً آسان‌تر است، بنابراین نباید چندان دردسرساز باشد.

    طراحی وب‌سایت خوبی داشته باشید!