How to convert a website into a Android app for free using android studio | Convert website to web application

AuthorHariom Prajapati

Pubish Date02 Jul 2022

categoryArticle

In this tutorial, we will learn that how to convert your blogger, wordpress or any other website to a professional Android app using Android studio.

First, let us see what android studio is

What is Android Studio?

Android studio is a very popular and fastest tool which use to building an app for every type of Android devices for free. 

So now using this Android studio we will build a professional website.

Follow all the below steps to turn website into app -

Step 1 - Download Android studio

In step 1 you need to download the Android studio app from the internet.

  • Open your web browser on a laptop or computer. 
  •  Now search for "download Android studio".


how to convert blogger wordpreess website into a android app

  • Now click on the first search results shown in below figure.


how to convert blogger wordpreess website into a android app

  • Let's click on "download Android studio" shown in the below figure.


how to convert blogger wordpreess website into a android app

  • Now you need to read term and condition page and then tick on agree button and then click on "download Android studio for window".


how to convert blogger wordpreess website into a android app

  • After clicking on the download button your Android studio will start downloading.


how to convert blogger wordpreess website into a android app

  • After downloading you need to install the Android studio.

Note :- Installation process may take longer time according to your Internet speed and specification of your laptop or computer, so keep waiting.

 

Step 2 - Now open your Android studio app.

 

Step 3 - click on create new project.


how to convert blogger wordpreess website into a android app

Step 4 - After that select "empty activity" and process to next shown in the below figure.


how to convert blogger wordpreess website into a android app

Step 5 - Now you will see a new interface in which you have to write.

  • Name - Name of your application.
  • Package name - Package name will automatically generate after you type name.
  • Save location - Remains it same.
  • Language - Change language to "Java".
  • Minimum SDK - Remains it same as "API 16: Android 4.1 (jelly bean).
  • Checkbox - Don't take on the checkbox.

Now click on the finish button.


how to convert blogger wordpreess website into a android app

Step 6 - After follow step 5 you need to wait for some time until the loading process not completed which shown in the below figure.


how to convert blogger wordpreess website into a android app

Step 7 - After the loading process is done then you will see "manifests" folder on left side.


how to convert blogger wordpreess website into a android app

Step 8 - Now open "manifests" folder and then double-click on "androidManifest.xml".


how to convert blogger wordpreess website into a android app

Step 9 - Now copy the below code.

Code

<uses-permission  android:name="android.permission.INTERNET"></uses-permission>

 

Step 10 - Now paste it on "androidManifest.xml" file after package name of your app, generated in step 5 as shown in figure.After that Press ctrl + a and then Press ctrl + s .


how to convert blogger wordpreess website into a android app

Step 11 - Now go to "activity_main.xml" file and select all code of "Textview" and delete them.


how to convert blogger wordpreess website into a android app


how to convert blogger wordpreess website into a android app

Step 12 - Now delete all the code of last line in "activity_main.xml" file but keep only "</layout>".

Note :- When you delete this code then you will see that the above code on second line will automatically deleted.


how to convert blogger wordpreess website into a android app


how to convert blogger wordpreess website into a android app

Step 13 - Now write "Relative" before "layout" without space as shown in below figure.


how to convert blogger wordpreess website into a android app

Step 14 - Now click on "design" on the right side of the window.


how to convert blogger wordpreess website into a android app

Step 15 - Now click on palette and search for "WebView".


how to convert blogger wordpreess website into a android app

Step 16 - Now drag and drop "WebView" inside the white rectangular box.


how to convert blogger wordpreess website into a android app

Then the rectangular box look like


how to convert blogger wordpreess website into a android app

Step 17 - Now click on code button which is in the right side of window.


how to convert blogger wordpreess website into a android app

Step 18 - Now copy the below code.

Code

android:id="@+id/webview"

 

Step 19 - Paste the code below of "web view" as shown in figure.


how to convert blogger wordpreess website into a android app

Step 20 - Now open the resource (res) folder and then right-click on "values" folder which is inside the resource (res) folder and go to new and then click on "values resource file".


how to convert blogger wordpreess website into a android app

Step 21 - Now write "style.xml" inside the "file name" and then remains every field same and then click on Ok.


how to convert blogger wordpreess website into a android app

Step 22 - Now delete all code inside "style.xml" file and then copy the below code and paste it inside "style.xml" file.

Code

<resources>
     <
style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
         <
item name="colorPrimary">@color/design_default_color_primary</item>
         <
item name="colorPrimaryDark">@color/design_default_color_primary_dark</item>
         <
item name="colorAccent">@color/design_default_color_on_secondary</item>
     </
style>
 </
resources
>


how to convert blogger wordpreess website into a android app

 

Step 23 - Now you need to go "MainActivity.java" and then click on three dots.


how to convert blogger wordpreess website into a android app

Step 24 - Now copy the below code and paste it on line number 6 after "import android.osBundle".

Code

import android.webkit.WebSettings;

 import android.webkit.WebView; 

import android.webkit.WebViewClient;


how to convert blogger wordpreess website into a android app

Step 25 - Now again copy the below code and paste it on line number 11 after "public class".

Code

private WebView mywebView;


how to convert blogger wordpreess website into a android app

Step 26 - Copy the below code and paste it after line number 15 like below figure.

Code

mywebView=(WebView) findViewById(R.id.webview);

mywebView.setWebViewClient(new WebViewClient());

mywebView.loadUrl("https://example.com/"); 

WebSettings webSettings=mywebView.getSettings(); 

webSettings.setJavaScriptEnabled(true);


how to convert blogger wordpreess website into a android app

Note :- Replace the example.com with your website URL.

 

Step 27 - Now click after second last closing bracket and press enter then paste the below code inside it .

Code

public class mywebClient extends WebViewClient{

 @Override

 public void onPageStarted(WebView view, String url, Bitmap favicon){

 super.onPageStarted(view,url,favicon); 

@Override 

public boolean shouldOverrideUrlLoading(WebView view,String url){

 view.loadUrl(url); 

return true; 

}

 } 

@Override 

public void onBackPressed(){ 

if(mywebView.canGoBack()) {

 mywebView.goBack(); 

else{ 

super.onBackPressed();

 }

 }

 

Now you will see a text which is in the colour red "Bitmap". Move your cursor over the text "Bitmap" and then click on "import class".


how to convert blogger wordpreess website into a android app

Step 28 - Now go to the resource (res) folder and then right-click on "drawable" and go to "new" and select "image asset".


how to convert blogger wordpreess website into a android app

Step 29 - Now choose the "path" of your logo from your computer or laptop then click "next" and then click on "finish".


how to convert blogger wordpreess website into a android app

Step 30 - now click on "build" button which at the top of the window and then click on "generate signed bundle / APK .


how to convert blogger wordpreess website into a android app

Step 31 - select "APK" and then click on "next".


how to convert blogger wordpreess website into a android app

Step 32 - Now click on "create new".


how to convert blogger wordpreess website into a android app

 

Step 33 - Now fill the form.

  • Key store path - Select any path from your computer where you want to save APK file.
  • Password - Write any password.
  • Confirm - Write same password.
  • Alias - remains it same.
  • Password - Write above password.
  • Confirm - Write same password.
  • Validity (years) - Select 50.
  • First and last name - Write your first and last name.
  • Organisation unit - Write your profession.
  • Organisation - Write your website name.
  • City or locality - Write your city name. 
  • State or province - Write your state name.
  • Country code (xx) - Write your two digits country code which you type before the mobile number.

Now click ok


how to convert blogger wordpreess website into a android app

Step 34 - Now tick on the "remember password" ( your choice) and then click "next".


how to convert blogger wordpreess website into a android app

Step 35 - Now select "release" and also tick on "signature versions" checkbox as shown in figure and then click on finish.


how to convert blogger wordpreess website into a android app

Step 36 - Now your app is ready. To view your apk file click on "executing tasks" shown in the image below

 

and then click on "locate" .

Here your apk file is inside the release folder. By default name of your apk file is "app-release.apk". So you need to rename it with your own website name like example.apk.

Note :- Do not remove ".apk" extension.

 


 

Frequently asked questions

1) Can you turn a website into an app?

Answer - Yes, you can turn a website into a app for free using Android studio. follow the above steps to create app using Android studio without coding knowledge.

 

2) How do I make my Google site a mobile app?

Answer - Make Google site or any other site to a mobile app by following above steps.

 

3) How do I make an APK file from a website?

Answer - Make an APK file of your website using Android studio by following each step written in this tutorial.

 

4) How can I create an Android application?

Answer - You can create an Android application for free using Android studio without knowledge of coding by following the above steps.

 

5) How convert HTML to APK?

Answer - You can convert your HTML code into APK using Android Studio for free by following the steps given in this tutorial.

Comments 0

Leave a comment