add

¿Cómo crear una app de mi blog de Blogger?


La forma más fácil y sencilla de crear una App de su blog de Blogger es siguiendo las instrucciones claras y precisas que se encuentra en este Tutorial de Blogger. No es cosa de otro mundo ni tampoco debes tener conocimientos de código, son unos simples pasos con los cuales al final tendrás tu propia App de tu blog de Blogger completamente gratis y luego comenzar a distribuirlo a tus amistades y así ellos se llevaran en su teléfono inteligente tu blog de Blogger y podrán acceder a ella y ver tus nuevas publicaciones.


¿Cómo crear una app de mi blog de Blogger?

¿Cómo se mostrara esta App?

- Vamos a utilizar un Splash screen, la cual es una pantalla de bienvenida, esta se demorara 10 segundos y luego seguirá su curso hasta cargar su blog de Blogger en la App

- Además, la aplicación solo se mostrara en forma vertical y no en horizontal

- Dispone de un menú para compartir sus artículos en sus redes sociales

Primer paso:

Habilite la plantilla móvil de su blog de Blogger, si no sabe cómo, siga las siguientes instrucciones


Segundo paso:

Necesita instalar en su computador de escritorio Android Studio, que es lo esencial para crear aplicaciones, siga las instrucciones de instalación de Android Studio desde los tres siguientes enlaces:


Tercer paso:

Una vez que haya instalado Android Studio y el JDK 8, estará listo para insertar unos códigos en su primer proyecto de Android Studio

Explicación:

Lo que vamos hacer es crear una proyecto “Una aplicacion” en Android Studio, copiaremos unos códigos he insertaremos la direccion URL de nuestro blog de Blogger. Al cargar todo el proyecto en Android Studio este creara su aplicación generando una APK. Esta APK es su aplicación móvil, la cual lo podrá instalar en su Smartphone que utilice sistema Android, como también lo podrá subir a Google Play y distribuir su aplicación gratis.

Al abrir su aplicación en un Smartphone, de inmediato se abrirá, y aparecerá su blog de Blogger dentro de ella, siempre y cuando tenga una plantilla móvil de su blog. Cada vez que usted publique una entrada en su blog, esta de inmediato se actualizara en su aplicación, porque estamos utilizando la dirección URL de su blog de Blogger, con esto sus seguidores verán sus noticias desde la aplicación que usted creo, siempre y cuando hayan instalado su App.

Nota: Se recomienda que tengan una buena plantilla móvil optimizada, para que se muestre un diseño profesional

Video tutorial - ¿Cómo crear una app de mi blog de Blogger?


Empezamos

1.- Abrir Android Studio

¿Cómo crear una app de mi blog de Blogger?

2.- Un clic en “Start a new Android Studio Project

¿Cómo crear una app de mi blog de Blogger?

3.- Le mostrara la siguiente pantalla

¿Cómo crear una app de mi blog de Blogger?

4.- Cambia donde dice:

Application name: Cámbialo por el nombre que quieras mostrar en tu aplicación
Company Domain: Cámbialo por la dirección URL de su empresa

Luego le das un clic en “Next

¿Cómo crear una app de mi blog de Blogger?

5.- Aparecerá la siguiente ventana en la cual debes seleccionar “API 16: Android 4.1 (Jelly Bean)” y das un clic en Next

¿Cómo crear una app de mi blog de Blogger?

6.- Ahora aparecerá una nueva ventana, escoge “Blank Activity”, luego un clic en Next

¿Cómo crear una app de mi blog de Blogger?

7.- Una nueva ventana aparecerá, solo debes dar un clic en el botón que dice Finish

¿Cómo crear una app de mi blog de Blogger?

Listo, está creando tu primer proyecto, espera unos minutos

¿Cómo crear una app de mi blog de Blogger?

8.- Nos mostrara lo siguiente en la parte izquierda, mire la siguiente imagen

¿Cómo crear una app de mi blog de Blogger?

9.- Por favor despliegue el proyecto de la siguiente manera, mire la imagen

¿Cómo crear una app de mi blog de Blogger?

10.- Un clic en AndroidManifest.xml les mostrara lo siguiente

¿Cómo crear una app de mi blog de Blogger?

11.- Vamos a eliminar una parte del código, mire la siguiente imagen

¿Cómo crear una app de mi blog de Blogger?

12.- Copie el siguiente código tal como lo muestro en la siguiente imagen

¿Cómo crear una app de mi blog de Blogger?

Insertar el siguiente código:

<uses-permission android:name="android.permission.INTERNET" />
    <
uses-permission android:name="android.permission.VIBRATE" />
    <
application
       
android:allowBackup="true"
       
android:icon="@mipmap/ic_launcher"
       
android:label="@string/app_name"
       
android:theme="@android:style/Theme.Holo.Light" >
        <
activity
           
android:name=".MainActivity"
           
android:screenOrientation="portrait"
           
android:label="@string/app_name" >
            <
intent-filter>
                <
action android:name="android.intent.action.MAIN" />

                <
category android:name="android.intent.category.DEFAULT" />
            </
intent-filter>
        </
activity>

        <
activity
           
android:name=".Splash"
           
android:label="@string/app_name" >
            <
intent-filter>
                <
action android:name="android.intent.action.MAIN" />

                <
category android:name="android.intent.category.LAUNCHER" />
            </
intent-filter>
        </
activity>

    </
application>

</
manifest>


13.- Creamos un nuevo Java class, con el nombre MyAppWebViewClient, mire la siguiente imagen

¿Cómo crear una app de mi blog de Blogger?

14.- Borramos una parte del código que nos generó, he insertamos un nuevo código

¿Cómo crear una app de mi blog de Blogger?

Insertar el siguiente código:

import android.content.Intent;

  import android.net.Uri;

  import android.webkit.WebView;

  import android.webkit.WebViewClient;

  

  public class MyAppWebViewClient extends WebViewClient {

  

    @Override

    public boolean shouldOverrideUrlLoading(WebView view, String url) {

        if(Uri.parse(url).getHost().endsWith("ayudadeblogger.com")) {

            return false;

        }

  

        Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(url));

        view.getContext().startActivity(intent);

        return true;

    }

}


Realice este cambio:

Elimine la dirección URL que dice ayudadeblogger.com y reemplácelo por la dirección URL de su blog de Blogger por ejemplo:

ejemplo.blogspot.com

15.- Vamos a crear un nuevo Java class con el nombre de Splash,  mire la siguiente imagen

¿Cómo crear una app de mi blog de Blogger?

16.- Eliminamos una parte del código y lo remplazamos por uno nuevo, mire la siguiente imagen

¿Cómo crear una app de mi blog de Blogger?

Insertar el siguiente código:

import android.annotation.SuppressLint;

  import android.annotation.TargetApi;

  import android.app.ActionBar;

  import android.app.Activity;

  import android.content.Intent;

  import android.os.Build;

  import android.os.Bundle;

  

  @SuppressLint("NewApi")

  public class Splash extends Activity {

  

    @TargetApi(Build.VERSION_CODES.HONEYCOMB)

    @SuppressLint("NewApi")

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_splash);

  

        ActionBar actionBar = getActionBar();

        actionBar.hide();

  

        Thread t =new Thread(){

            public void run(){

                try{

                    sleep(10000);

                }catch(InterruptedException e){

                    e.printStackTrace();

                }finally{

                    Intent i =new Intent(Splash.this,MainActivity.class);

                    startActivity(i);

                }

            }

        };

        t.start();

    }

    @Override

    public void onPause(){

        super.onPause();

        finish();

    }

  

}


17.- Damos un clic en MainActivity, nos mostrara lo siguiente

¿Cómo crear una app de mi blog de Blogger?

18.- Tenemos que eliminar parte del código, y lo remplazamos por otro tal como lo muestro en la siguiente imagen

¿Cómo crear una app de mi blog de Blogger?

Inserta el siguiente código:

import android.app.ActionBar;

  import android.app.Activity;

  import android.content.Intent;

  import android.content.res.Configuration;

  import android.os.Bundle;

  import android.view.Menu;

  import android.view.MenuItem;

  import android.view.View;

  import android.webkit.WebSettings;

  import android.webkit.WebView;

  import android.widget.ShareActionProvider;

  import android.widget.Toast;

  

  

  public class MainActivity extends Activity {

  

    private WebView mWebView;

  

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_main);

  

        mWebView = (WebView) findViewById(R.id.activity_main_webview);

        WebSettings webSettings = mWebView.getSettings();

        webSettings.setJavaScriptEnabled(true);

        mWebView.loadUrl("http://www.ayudadeblogger.com");

        mWebView.setWebViewClient(new MyAppWebViewClient());

        // Stop local links and redirects from opening in browser instead of WebView

        mWebView.setWebViewClient(new MyAppWebViewClient(){

            @Override

            public void onPageFinished(WebView view, String url) {

                //hide loading image

                findViewById(R.id.progressBar1).setVisibility(View.GONE);

                //show webview

                findViewById(R.id.activity_main_webview).setVisibility(View.VISIBLE);

            }});

  

  

    }

  

    @Override

    public void onBackPressed() {

        if(mWebView.canGoBack()) {

            mWebView.goBack();

        } else {

            super.onBackPressed();

        }

    }

  

    private ShareActionProvider mShareActionProvider;

    @Override

    public boolean onCreateOptionsMenu(Menu menu) {

  

        /** Inflating the current activity's menu with res/menu/items.xml */

        getMenuInflater().inflate(R.menu.menu_main, menu);

  

        /** Getting the actionprovider associated with the menu item whose id is share */

        mShareActionProvider = (ShareActionProvider) menu.findItem(R.id.share).getActionProvider();

  

        /** Setting a share intent */

        mShareActionProvider.setShareIntent(getDefaultShareIntent());

  

        return super.onCreateOptionsMenu(menu);

  

    }

  

    /** Returns a share intent */

    private Intent getDefaultShareIntent(){

        Intent intent = new Intent(Intent.ACTION_SEND);

        intent.setType("text/plain");

        intent.putExtra(Intent.EXTRA_SUBJECT, "Widgets y Plugins para Blogger");

        intent.putExtra(Intent.EXTRA_TEXT," Visita www.ayudadeblogger.com Todo sobre BLogger");

        return intent;

    }

  

  

}


Realice estos cambios:

Elimine la dirección URL que dice ayudadeblogger.com y reemplácelo por la dirección URL de su blog de Blogger, por ejemplo

ejemplo.blogspot.com

De igual manera existe otra dirección URL que está marcada de color amarillo ayudadeblogger.com elimínelo y ponga su dirección web

También cambie los nombres que están marcados de color amarillo y dicen Widgets y Plugins para Blogger, ingrese una nueva frase

19.- Un clic en Activity_main.xml le mostrara lo siguiente

¿Cómo crear una app de mi blog de Blogger?

20.- Elimine todo el código que se encuentra, y reemplácelo por otro código, mire la siguiente imagen

¿Cómo crear una app de mi blog de Blogger?

Insertar el siguiente código:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    xmlns:tools="http://schemas.android.com/tools"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    tools:context=".MainActivity"

    android:orientation="vertical">

  

    <ProgressBar

        android:id="@+id/progressBar1"

        style="?android:attr/progressBarStyleLarge"

        android:layout_width="wrap_content"

        android:layout_height="match_parent"

        android:layout_centerHorizontal="true"

        android:indeterminate="false"

        android:layout_gravity="center" />

  

    <WebView

        android:id="@+id/activity_main_webview"

        android:layout_width="match_parent"

        android:layout_height="match_parent"

        android:visibility="gone"/>

</LinearLayout>


21.- Crear un activity_splash.xml , mire la siguiente imagen

¿Cómo crear una app de mi blog de Blogger?

22.- Un clic en activity_splash y nos mostrara el siguiente código, mire la imagen

¿Cómo crear una app de mi blog de Blogger?

23.- Eliminamos todo el código que se encuentra y lo remplazamos por otro, mire la siguiente imagen

¿Cómo crear una app de mi blog de Blogger?

Insertar el siguiente código:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

    xmlns:tools="http://schemas.android.com/tools"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:background="@mipmap/app_ayudadeblogger"

    tools:context=".Splash" >

  

  

</RelativeLayout>


24.- Un clic en menu_main.xml , nos mostrara el siguiente código, mire la siguiente imagen

¿Cómo crear una app de mi blog de Blogger?

25.- Elimine todo el código que se encuentra y lo remplaza por otro código, mire la siguiente imagen

¿Cómo crear una app de mi blog de Blogger?

Insertar el siguiente código:

<menu xmlns:android="http://schemas.android.com/apk/res/android"

    xmlns:tools="http://schemas.android.com/tools" tools:context=".MainActivity">

    <item

        android:id="@+id/share"

        android:title="@string/share"

        android:showAsAction="ifRoom"

        android:actionProviderClass="android.widget.ShareActionProvider"/>

</menu>


26.- Abrir strings.xml , le mostrara lo siguiente, mire la imagen

¿Cómo crear una app de mi blog de Blogger?

27.- Elimine todo el código que se encuentra y reemplácelo por otro código

¿Cómo crear una app de mi blog de Blogger?

Insertar el siguiente código:

<resources>

    <string name="app_name">AdB</string>

  

    <string name="hello_world">Hello world!</string>

    <string name="share">Share</string>

    <string name="action_websearch">Web search</string>

</resources>


28.- Ahora necesitamos insertar una imagen de bienvenida, para realizar este truco siga las siguientes instrucciones.

Primero cree una imagen de bienvenida que tenga una dimensión de 701x927 y guárdelo con el siguiente nombre:

app_ayudadeblogger

Por ejemplo esta es la imagen de bienvenida de mi app

¿Cómo crear una app de mi blog de Blogger?

Una vez creado, siga las siguientes instrucciones:

Mire la secuencia de la siguiente imagen

¿Cómo crear una app de mi blog de Blogger?

Recuerde realizar este proceso de copiar la imagen de bienvenida dentro de los 5 puntos que le dejo señalando

¿Cómo crear una app de mi blog de Blogger?

29.- Hemos terminado parte de la configuración, estamos listos para guardar nuestra app y así nos generara nuestra APK, la cual nos servirá para que se muestre en nuestro teléfono inteligente

Siga las siguientes instrucciones

1 Un clic en “Build” luego en “Generate signed APK

¿Cómo crear una app de mi blog de Blogger?

2 Ingresamos diferentes datos, dentro de ella, mire la imagen

¿Cómo crear una app de mi blog de Blogger?

- Luego un clic en Next

- Se nos abrirá la siguiente ventana

¿Cómo crear una app de mi blog de Blogger?

- Luego damos un clic en Finish

Nota: recuerde esperar 1 minuto hasta que se le genere la APK

Tenemos que hacer un Run para generar nuestra APK, deben dar un clic en el icono que les muestro a continuación


Se abrirá una nueva ventana escojan cualquiera de los emuladores y dan un clic en OK

¿Cómo crear una app de mi blog de Blogger?

- Eso es todo

Para buscar la APK en nuestro computador siga las siguientes instrucciones y así instalarlo en nuestro Smartphone o tableta

Vamos a buscar nuestra APK en el computador

1.- Hacer clic derecho en la pestaña que dice app

¿Cómo crear una app de mi blog de Blogger?

2.- Un clic en Show in Explorer

3.- Para hacerles más fácil, miren la secuencia de la siguiente imagen

¿Cómo crear una app de mi blog de Blogger?

Su APK es la que tiene como nombre

App-debug-unaligned.apk

Recuerde que puede cambiarle de nombre siempre manteniendo el .apk

Eso es todo, ahora si distribuye tu nueva App con todas tus amistades, puedes subir el archivo en drive.google.com y compartir con el público en general

Vista desde un teléfono inteligente para Instalar la APK

¿Cómo crear una app de mi blog de Blogger?

¿Cómo crear una app de mi blog de Blogger?
¿Cómo crear una app de mi blog de Blogger?
¿Cómo crear una app de mi blog de Blogger?
¿Cómo crear una app de mi blog de Blogger?
¿Cómo crear una app de mi blog de Blogger?
¿Cómo crear una app de mi blog de Blogger?
¿Cómo crear una app de mi blog de Blogger?
¿Cómo crear una app de mi blog de Blogger?
¿Cómo crear una app de mi blog de Blogger?
¿Cómo crear una app de mi blog de Blogger?
¿Cómo crear una app de mi blog de Blogger?
¿Cómo crear una app de mi blog de Blogger?

¿Cómo crear una app de mi blog de Blogger?
¿Cómo crear una app de mi blog de Blogger?

- Puedes descargarte la aplicación y mirar como funciona, desde el siguiente enlace


Para los seguidores de Ayudadeblogger.com

Si aún no has podido realizar este grandioso truco de cómo crear una App de tu blog de Blogger, puedes dejarme un comentario en este post, solicitando que te ayude a crear tu App, con gusto te ayudare y te enviare el link de descarga de tu App de Blogger dentro de su comentario en este post.

Instrucciones para crear su app

Primero: Deberá dejar un comentario en este post solicitando que le realice la app de su blog de Blogger he indicar que ya envió dicha solicitud

Segundo: Enviar la solicitud a la siguiente dirección de correo: ayudadeblogger@gmail.com

Adjuntar la siguiente información:

- Dirección URL de su blog de Blogger o de su pagina web

- Adjuntar una imagen de portada de su blog de Blogger que tenga un tamaño de 701x927 pixeles

- Indicar el nombre con el que quiera que se muestre su app, por ejemplo "Coches"

Eso es todo..................

Cualquier pregunta no duden en escribir

Saludos


11 comentarios:

  1. Luis,
    Lo intenté en cuatro ocasiones y siempre me salen los siguientes errores:
    C:\Users\Nando\AndroidStudioProjects\Solopisadas\app\src\main\java\es\com\solopisadas\httpwww\solopisadas2\MainActivity.java
    Error:(57, 39) error: cannot find symbol class MyAppWebViewClient
    Error:(61, 39) error: cannot find symbol class MyAppWebViewClient
    C:\Users\Nando\AndroidStudioProjects\Solopisadas\app\src\main\java\Splash.java
    Error:(33, 25) error: package R does not exist
    Error:(57, 54) error: cannot find symbol class MainActivity
    Error:Execution failed for task ':app:compileReleaseJavaWithJavac'.
    > Compilation failed; see the compiler error output for details.

    Te agradeceria si pudieses ayudarme.
    Mi correo es ferreiro2008@solopisadas.com.es
    Muchas gracias

    ResponderEliminar
    Respuestas
    1. Hola, con respecto a su pregunta, tal ves algo esta realizando inadecuada mente, pero le puedo ayudar a crear su app de su blog de Blogger, por favor envíeme un correo electrónico a la siguiente dirección: ayudadeblogger@gmail.com

      Ademas, al momento que me envié un correo, debe indicarme la dirección URL de su blog de Blogger, como también adjuntar una imagen de portada que tenga una dimensión de 701x927 pixeles, como eso le estaré enviando el enlace de descarga de su app por medio de este mensaje, en este post.

      Saludos.

      Eliminar
    2. Hola, ya le cree la App de su blog de Blogger, por favor puede descargar su aplicación desde el siguiente enlace:

      https://drive.google.com/file/d/0B4Z9VSqNHBcpakJxSHU2MXEwR0U/view

      Saludos.

      Eliminar
    3. Muchas gracias Luis. La App funciona perfectamente, lo máximo ya sería que la imagen que sale en el teléfono fuese la miniatura. Muchisimas gracias por tu ayuda.

      Eliminar
  2. Buenos días Luis, ¿Podrías ayudarme? Tengo un error al momento de generar el "signed APK", y creo estar haciendo todo bien. Pongámonos en contacto para más detalles sobre el problema, lo apreciaría mucho si puedes ayudarme. Gracias.

    ResponderEliminar
    Respuestas
    1. Hola Patricio, el problema del signed APK es un pequeño inconveniente que algunos usuarios tienen al generar la APK, puede buscar la solución al Signed APK en Google.com y si aun no puede realizarlo, no dude en escribir y con gusto le ayudare en crear su APK

      Saludos.

      Eliminar
  3. Hola, tengo una pregunta ¿devido a que es este error?

    Error:Execution failed for task ':app:validateSigningRelease'.
    > Keystore file C:\Users\Las Mil Ofetas\AndroidStudioProjects\DjFantasma2\Dj Fantasma not found for signing config 'externalOverride'.

    ResponderEliminar
    Respuestas
    1. Hola Eddy, gracias por escribir, sobre lo que usted indica le comento lo siguiente:

      Suele ser el caso en ocasiones en Android Studio al momento de crear la ApK de su APP, que no le deja crear por que le esta diciendo que no encuentra donde guardar. Necesita ubicar la Keysotre.

      Para ello, Google tiene una fuente en el cual explica como generar la ApK de otra forma.

      Android requiere que todos los APK estén firmados digitalmente con un certificado antes de que puedan instalarse. Este documento describe cómo firmar sus APKs utilizando Android Studio, incluyendo la creación y almacenamiento de su certificado, la firma de diferentes configuraciones de compilación utilizando certificados diferentes y la configuración del proceso de creación para firmar automáticamente sus APK

      A continuación le dejo el enlace:

      https://developer.android.com/studio/publish/app-signing.html

      Siga las instrucciones a partir de donde dice:

      Configure the Build Process to Automatically Sign Your APK

      Saludos.

      Eliminar
    2. Otra consulta mas si no es mucha molestia. Por que cuando entro al aplicación navega la pagina en otro navegador como ser chrome y no en la misma aplicación creada?

      Eliminar
    3. Hola Eddy, si usted siguió este tutorial no debe correr la pagina en el navegador web, sea el caso que usted tenga ingresado una direccion URL que no sea de su blog, solo ahí si se le abrirá en el navegador web, pero como le comento si usted dispone de enlaces que son de su propio blog no tendría por que abrirse en el navegador.

      Saludos.

      Eliminar

person_pin Luis Chávez

group_work Fundador

contact_phone +593 994589032

email ayudadeblogger@gmail.com

Entradas populares

Youtube.com/ayudadeblogger

Suscríbete

Etiquetas

Adsense dispositivos moviles (2) Alojamiento web (12) Aplicaciones moviles (15) Backlinks (1) Breaking News para Blogger (3) Como (32) Como crear una pagina web gratis (8) Comprar Dominios (2) Comprar un Dominio en Godaddy (2) Configurar dominio de Godaddy en Blogger (1) Consejos de Blogs (33) Consejos de Trafico (12) Correo Dominio (3) Crear un Sitemap (6) Crear una Aplicacion gratis (2) Diseno Responsive (5) Diseño Web (7) En vivo (1) Entradas Populares (18) Enviar Sitemap a Bing y Yahoo (1) Error al analizar XML (5) Facebook trucos (10) Firefox (9) Formulario de contactos (3) Ganar Dinero (22) Google (11) Google Adsense (10) Google Plus (5) Guia de SEO (2) Herramientas Blogger (4) Herramientas para Webmasters (6) Iconos Font Awesome (1) Info Tech (1) La ética de los blogs (2) Laptops (2) Manual Blogger (10) Material Design Blogger (2) Medios de Comunicacion Social (39) Menu desplegable (20) Menu Responsive para Blogger (6) Mobile-friendly (9) Movil (12) Noticias (3) Optimizado para moviles (4) Plantillas Blogger (42) Plantillas Landing page para Blogger (3) Popout (6) Posicionamiento SEO (22) Publicidad (2) SEO Mobile (12) SEO para Moviles (14) Sitemap (1) Sitios web optimizados para moviles (3) Slider Carrusel (7) Slideshow (35) Smartphone (12) Social Media Marketing (1) Tácticas de Marketing (4) Tecnologia (12) Temas de invitados (2) Top Hosting (3) Trucos Blogger (40) Trucos CSS y HTML (11) Web Hosting (14) Widget Acordeón (3) Widget Tab Multiple (1) Widgets para Blogger (69) Widgets Suscripciones (9) Widgets y Plugins (6)

Formulario de contacto

Nombre

Correo electrónico *

Mensaje *

Seguidores

Comentarios